我试图从图像中获取像素数据来计算图像的平均亮度。我用img.loadPixels();
访问数据没有问题,但由于某种原因,像素数组的一些元素是undefined
,这打破了我的计算。
这是sketch.js
的代码:
var img;
var brightness;
var inc;
var gotBright = false;
function preload(){
img = loadImage('assets/2.png');
}
function setup(){
createCanvas(500, 500);
background(0);
}
function draw(){
img.resize(10, 10);
image(img, 0, 0, img.width, img.height);
brightness = 0;
inc = 0;
if (gotBright == false) {
img.loadPixels();
loadPixels();
for (var i = 0; i < img.width; i++) {
for (var j = 0; j < img.height; j++) {
var index = (i * j * img.width) * 4;
var r = img.pixels[index + 0];
var g = img.pixels[index + 1];
var b = img.pixels[index + 2];
brightness += (r + g + b) / 3;
inc ++;
console.log(inc, r , g, b);
}
}
gotBright = true;
brightness = brightness/inc;
}
}
brightness
应该等于0到255之间的某个数字,但现在它是NaN
...
如果你有其他方法的建议来计算图像的平均亮度,我很高兴听到他们:)谢谢!
我认为你的指数计算是错误的。不应该是:
var index = (i + j * img.width) * 4;
Bauer's answer走在正确的轨道上。您需要确保像素索引正确。最好的方法是拿出一张方格纸并绘制一些例子。
或者你可以使用带有get()
和x
参数的y
函数。来自the reference:
var myImage;
var c;
function preload() {
myImage = loadImage("assets/rockies.jpg");
}
function setup() {
background(myImage);
noStroke();
c = myImage.get(60, 90);
fill(c);
rect(25, 25, 50, 50);
}