1のカスタム％を2次元のブランク配列に設定します.1はランダムにシャッフルされますか？

Question

私はスタックオーバーフローの長い時間を過ごしてきましたが、私は適切な既存のソリューションを見つけることができませんでした...

私はJSとHTMLを学習しています。ゲームボードを作る。これまでは、すべての白いタイルを持つゲームボード用のカスタム行/列を作成しました（現在は0と表示されています）。

私の目標は、黒いタイル（1で表される）の％の入力フィールドを使用してボード（2D配列）を塗りつぶすことですが、黒いタイルをランダムに分散/シャッフルする必要があります。

は、ここで任意のヘルプやアドバイスを事前に感謝を..私はこれまで持っているものだ

https://jsfiddle.net/5pvm4mmy/6/

function generateArray() { 

var myNode = document.getElementById("table"); 
while (myNode.firstChild) { 
    myNode.removeChild(myNode.firstChild); 
} 

rows = $("#rows-field").val(); 
cols = $("#cols-field").val(); 

concentration = $("#concentration-field").val() 
source = $("#source-field").val(); 
target = $("#target-field").val(); 



var table = document.getElementById("table"); 
for (var i = 0; i < rows; i++) { 
    var tr = document.createElement('tr'); 
    for (var j = 0; j < cols; j++) { 
     var td = document.createElement('td'); 
     if (i%2 == j%2) { 
      td.className = "white"; 
     } else { 
      td.className = "black"; 
     } 
     tr.appendChild(td); 
    } 
    table.appendChild(tr); 
} 
document.body.appendChild(table); 


} 

。

Answer 1

あなたが定義済みの値のセットをランダムに選択する必要がある場合は、スタックを使用することができます。それをカードのデッキと考えて、デッキに残っているカードの枚数から毎回ランダムなカードを選んでください。この場合、2つの値しかありませんが、黒と白の数を設定することができます。このために、擬似スタックを使用することができます。

var black = 29; // 29 blacks the rest white 
var white = (rows * cols) - black; 

function getRandSquare(){ 
    var select = Math.floor(Math.random() * (black + white)); 
    if(select > black){ 
     white -= 1; 
     return "white"; 
    } 
    black -= 1; 
    return "black"; 
} 

カードのデッキのような多くのオプションがある場合は、配列を使用します。

ランダムスタックの例。

// create a deck 
var cards = []; 
for(var c = 0; c < 52; c++){ 
    cards[c] = c; 
} 
function shuffle(cards){ 
    var shuf = []; // to hold the shuffled deck 
    while(cards.length > 0){ // pick a random item, take it from the stack and 
          // put on the new stack until there are no items 
          // left 
     shuf.push(cards.splice(Math.floor(Math.random() * cards.length),1)); 
    } 
    return shuf; // return shuffled deck 
} 

cards = shuffle(cards); // get shuffled deck. 

あらかじめ定義されたセットからランダムに選択する必要があるものであれば、どちらでも動作します。常に60黒

var cont; 
 
function draw(){ 
 
    var rows = 15; 
 
    var cols = 15; 
 
    var black = 60; // 29 blacks the rest white 
 
    var white = (rows * cols) - black; 
 
    
 
    function getRandSquare(){ 
 
     var select = Math.floor(Math.random() * (black + white)); 
 
     if(select > black-1){ 
 
      white -= 1; 
 
      return "white"; 
 
     } 
 
     black -= 1; 
 
     return "black"; 
 
    } 
 
    
 
    var bCount = 0; 
 
    cont = document.createElement("div"); 
 
    for(var y = 0; y < rows; y++){ 
 
     for(var x = 0; x < cols; x++){ 
 
      var s = document.createElement("span"); 
 
      s.className = getRandSquare(); 
 
      if(s.className === "black"){ 
 
       s.textContent = bCount; 
 
       bCount += 1; 
 
      } 
 
      s.style.top = ((y+2) * 20) + "px"; 
 
      s.style.left = (x * 20) + "px"; 
 
      s.style.width = "20px"; 
 
      s.style.height = "20px"; 
 
      cont.appendChild(s);           
 
     } 
 
     
 
    } 
 
    document.body.appendChild(cont); 
 
} 
 
document.body.onclick = function(){ 
 
    document.body.removeChild(cont); 
 
    cont = null; 
 
    draw(); 
 
} 
 
draw(); 
 

span { 
 
    position:absolute; 
 
    border : 1px solid; 
 
    font-size : small; 
 
    text-align : center; 
 
} 
 
.black { 
 
    background : black; 
 
    border-color :white; 
 
    color : white; 
 
} 
 
.white { 
 
    background : white; 
 
    border-color :black; 
 
}

<h3>Click to randomise</h3>

Answer 2

気にしないでください。ありがとう！

https://jsfiddle.net/5pvm4mmy/8/

function generateArray() { 

var myNode = document.getElementById("table"); 
while (myNode.firstChild) { 
    myNode.removeChild(myNode.firstChild); 
} 

rows = $("#rows-field").val(); 
cols = $("#cols-field").val(); 

concentration = $("#concentration-field").val(); 
source = $("#source-field").val(); 
target = $("#target-field").val(); 



var table = document.getElementById("table"); 
for (var i = 0; i < rows; i++) { 
    var tr = document.createElement('tr'); 
    for (var j = 0; j < cols; j++) { 
     var td = document.createElement('td'); 
     if (concentration < Math.floor((Math.random() * 100) + 1)) { 
      td.className = "white"; 
     } else { 
      td.className = "black"; 
     } 
     tr.appendChild(td); 
    } 
    table.appendChild(tr); 
} 
document.body.appendChild(table); 


}