（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的数字

回答

相关问题