我正在寻找一种在透明PNG中检测图像的javascript方法.例如,我将使用940x680的透明画布创建一个PNG,然后在该画布中的某处放置一个完整的不透明对象.
我希望能够检测到画布中不透明的对象的大小(h/w)和顶部+左侧位置
这是原始图像的示例
这是我想要实现的一个例子.(边框重叠,顶部+左边距数据)

我发现了一个资源,它做了一些透明度检测,但我不知道我如何将这样的东西扩展到我正在寻找的东西.
var imgData,
width = 200,
height = 200;
$('#mask').bind('mousemove', function(ev){
if(!imgData){ initCanvas(); }
var imgPos = $(this).offset(),
mousePos = {x : ev.pageX - imgPos.left, y : ev.pageY - imgPos.top},
pixelPos = 4*(mousePos.x + height*mousePos.y),
alpha = imgData.data[pixelPos+3];
$('#opacity').text('Opacity = ' + ((100*alpha/255) << 0) + '%');
});
function initCanvas(){
var canvas = $('<canvas width="'+width+'" height="'+height+'" />')[0],
ctx = canvas.getContext('2d');
ctx.drawImage($('#mask')[0], 0, 0);
imgData = ctx.getImageData(0, 0, width, height);
}
Run Code Online (Sandbox Code Playgroud)