gpt4 book ai didi

javascript - 加载图像时,getImageData 提供一些零

转载 作者:行者123 更新时间:2023-11-28 06:05:34 27 4
gpt4 key购买 nike

我正在加载一个 PNG 并尝试检查它是否完全不透明,这意味着 alpha channel 在整个图像上接近 100%。因此,我使用 Canvas 和 2D-​​Context 来获取像素数据并循环检查 alpha 值。

令我惊讶的是,我得到了整个零区域(RGBA = [0000]),而这显然不应该。

焦点浏览器:chrome 50.0.2661.87

这是我的代码,它嵌入在 ThreeJS 环境中:

var imageData = zipHandler.zip.file(src); // binary image data

var texture = new THREE.Texture();

var img = new Image();
img.addEventListener( 'load', function ( event ) {

texture.imageHasTransparency = false; // extend THREEJS Texture by a flag

if (img.src.substring(imgSrc.length-4).toLowerCase().indexOf("png") > -1
|| img.src.substring(0, 15).toLowerCase().indexOf("image/png") > -1) {

var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
context.drawImage(img, 0, 0, img.width, img.height );
var pixDataContainer = context.getImageData(0, 0, img.width, img.height);
var pixData = pixDataContainer.data;

// search for pixel.alpha < 250
for (var pix = 0, pixDataLen = pixData.length; pix < pixDataLen; pix += 4) {
if (pixData[pix+3] < 250) {
texture.imageHasTransparency = true;
break;
}
}
}

texture.image = img;
texture.needsUpdate = true;
this.removeEventListener('load', arguments.callee, false);

}, false );

var fileExtension = src.substr(src.lastIndexOf(".") + 1);
img.src = "data:image/"+fileExtension+";base64,"+ btoa(imageData.asBinary());

顺序是正确的:首先定义 new Image(),然后是 onload 函数,最后是源。

最佳答案

已解决。图像比 Canvas 大,因此当启动 context.drawImage() 时,只有部分区域被填充。我已经根据图像大小设置了 Canvas 尺寸,所以现在它可以工作了,我们已经

// ...
var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
canvas.width = img.width; // !!!!!
canvas.height = img.height; // !!!!
context.drawImage(img, 0, 0, img.width, img.height );
var pixDataContainer = context.getImageData(0, 0, img.width, img.height);
var pixData = pixDataContainer.data;
// ...

关于javascript - 加载图像时,getImageData 提供一些零,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36895439/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com