ランダム処理をする際に重複しない値でなおかつ16pxずつ値を作成したい

現在は重複しない値までは作成できたのですが、16px感覚でランダムな値を作成する方法が分かりません。解答よろしくおねがいします。

javascript
1function randomizing(min, max) {
2  var arr = [];
3  var numArr = [];
4  for (var i = 0; i < max - min; i++) {
5    arr[i] = i + 1;
6  }
7
8  for (var j = 0, len = arr.length; j < max - min; j++, len--) {
9    rndNum = Math.floor(Math.random() * len);
10    numArr.push(arr[rndNum]);
11    arr[rndNum] = arr[len - 1];
12  }
13  return numArr;
14};
15var map_y_random = randomizing(20, 50);

使う箇所としてマップに宝箱などを作成した際にランダムな値のため宝箱同士が重ならないようにしたいです。
テスト画面のurlになります
http://enchantrun.starfree.jp/

行動規範の内容に同意します

回答2件

ベストアンサー

何個の宝箱を配置するかはお好きにしていただくとして、位置の決め方のみ説明します。

配置する範囲を「min以上max未満」とするとき、間隔を16ずつにするには、Math.floor((max - min) / 16)をまず計算します。この値を適当な変数、たとえばhogeに保存します。
次に、「0以上hoge未満の整数の疑似乱数」を生成します。たとえば、hogeが4であれば、0,1,2,3のいずれかを(等確率で)生成します。これは、Math.floor(Math.random() * hoge)で求められます。この値を適当な変数、たとえばfugaに保存します。
すると、配置する位置はmin + fuga * 16で求められます。この値は最大でもmax未満になります。

理解が進んだら、一時変数に使ったhogeやfugaを、計算式で置換しても構いません。

投稿2020/06/12 00:37

Daregada

総合スコア11990

web11

2020/06/12 09:52

ありがとうございます。もっと難しい処理走らせないと行けないかと思ってました。

Daregada

2020/06/12 11:41

もちろん、同じ場所に二個の宝箱を重ねたくないなら、「この場所には何も置かれていない」ことを調べたり、他の箱の位置をチェックしたり、といった処理が必要です

行動規範の内容に同意します

js
1  for (var i = 0; i < max - min; i++) {
2  //arr[i] = i + 1;
3  // 数値的にはmin * 16 から max * 16 までになるので注意
4    arr[i] = ( ( i + 1 ) * 16 ) + 'px';
5  //arr[i] = ( ( i + min ) * 16 ) + 'px'; // min/maxならこっちじゃないかな。
6  }