（Math.random（）* x）+ y返回大於x + y的數字

所以我一直使用HTML canvas和Javascript來創建隨機圖像。它大部分運行相當順利，但最近我遇到了問題。（Math.random（）* x）+ y返回大於x + y的數字

我想添加一個用戶界面，用戶可以在其中爲像素的紅色，綠色和藍色值創建上下界，以及更改像素的大小。顏色給我帶來麻煩。

出於某種原因，有以下功能：

function getRandomInt(min,max){ 
    return Math.floor(Math.random() * (max - min + 1)) + min; 
}

將返回值大於MAX。我還沒有弄清楚爲什麼。

rmax = document.getElementById('rmax').value;

在另一個函數

：

欲瞭解更多信息，@Max和@Min從<input type="number">標籤中包含的代碼來源。然後，它們存儲在一個數組數組中（我知道這是凌亂的內存明智，但數組的大小不應該是可怕的大，所以它不是目前這個原因的問題）。

IE：

var height = canv.getAttribute("height"); 
var width = canv.getAttribute("width"); 
var tall = Math.floor(height/blockh)+1; 
var wide = Math.floor(width/blockw)+1; 
var mat = new Array(wide); 
for(var i = 0; i<wide; i++){ 
    mat[i] = new Array(tall); 
} 
for(var i = 0; i<wide; i++){ 
    for(var j = 0; j<tall; j++){ 
     r = getRandomInt(rmin,rmax); 
     g = getRandomInt(gmin,gmax); 
     b = getRandomInt(bmin,bmax); 
     mat[i][j] = new Array(4); 
     mat[i][j][0] = r; 
     mat[i][j][1] = g; 
     mat[i][j][2] = b; 
     mat[i][j][3] = false; 
    } 
}

最後，我通過mat運行，並利用帆布繪製每個像素：

for(var i = 0; i<wide; i++){ 
    for(var j = 0; j<tall; j++){ 
     drawBlock(ctx,mat[i][j][0],mat[i][j][1],mat[i][j][2],(i*blockw),(j*blockh)); 
     mat[i][j][3] = true; 
    } 
} 
//more code 
function drawBlock(canv,r,g,b,x,y) { 
    color = "rgba("+r+","+g+","+b+","+"1)"; 
    canv.beginPath(); 
    canv.fillStyle=color; 
    canv.moveTo(x,y); 
    canv.lineTo(x+blockw,y); 
    canv.lineTo(x+blockw,y+blockh); 
    canv.lineTo(x,y+blockh); 
    canv.lineTo(x,y); 
    canv.fill(); 
    canv.closePath(); 
}

通過<input>標籤的性質，所有的分鐘和馬克塞斯的被迫之間0和256.

但是，當我運行代碼時，它獲得了mins和maxes的正確值，但它計算的顏色值爲fa超出最大值。例如，rmin = 0;和rmax = 256;我已經獲得了約8000的r值。顯然，這是一個問題，因爲我是介於0和256

注意只想找值：當我只是做基於.js文件默認繪圖，它工作正常。在從<input>標記中檢索值並且再次運行後，我只會遇到問題。

我相信問題出在getRandomInt()函數中，但它有可能是我從<input>標記中檢索值。不過，我懷疑這一點，因爲我已經做了一些故障排除，它檢索的值似乎是正確的。

任何想法？

來源

2014-12-03 user3739472

整數最大和最小的參數，並不總是相同的，所以我沒有包括他們的單個值。下面是一個示例運行示例：min = 1，max = 31，generated = 171。我將編輯帖子以包含幾個示例。 – user3739472 2014-12-03 21:05:46

它發生是因爲你傳遞字符串作爲參數。

getRandomInt('0', '256') // 1540

接下來會發生什麼 - 是Math.floor(Math.random() * (max - min + 1))表達式返回的數量是級聯與min串。

您必須顯式地轉換爲使用parseInt(rmax, 10)

來源

2014-12-03 21:06:10 zerkms

或者只是'Number（rmax）'或'+ rmax'。 – 2014-12-03 21:07:04

這聽起來像是對的 - 但我認爲HTML5中的標記的值是一個整數，而不是一個字符串。但我可能是錯的。我會嘗試你的解決方案。 – user3739472 2014-12-03 21:07:48

@ user3739472：使用'typeof'並確定知道。 – zerkms 2014-12-03 21:08:33

（Math.random（）* x）+ y返回大於x + y的數字

回答

相關問題