HTML5获取画布中的alpha像素数

and*_*111 2 html5 alpha canvas alpha-transparency

我需要在画布中获得透明/不透明像素的比例.做这个的最好方式是什么?

更新:根据以下帖子,我最终编写了这段代码:

function getNumberOfAlphaPixels(can) {
    var step = 200; //We skip 200 pixels to make it work faster
    var ctx = can.getContext('2d');
    var imgd = ctx.getImageData(0, 0, can.width, can.height);
    var pix = imgd.data;
    var alphaPixelsNum = 0;

    for (var i = 0; i < pix.length; i += 4*step) {
        if (pix[i+3] == 0) {
            alphaPixelsNum += step;
        }
    }

    return alphaPixelsNum;
}
Run Code Online (Sandbox Code Playgroud)

and*_*wmu 7

如上所述,计算单个不透明像素是唯一的方法.

以下可能比其他答案中显示的伪代码更快.尽管有JIT跟踪/代码分析,但它确实有助于说明基本的低级别操作.

function alphaRatio(ctx) {
  var alphaPixels = 0;

  var data = ctx.getImageData(0,0, ctx.canvas.width,ctx.canvas.height).data;
  for(var i=3; i<data.length; i+=4) {
    if(data[i] > 0) alphaPixels++;
  }

  return alphaPixels / (ctx.canvas.width * ctx.canvas.height);
}
Run Code Online (Sandbox Code Playgroud)