HTML5獲取畫布中alpha像素的數量

我需要獲取畫布中透明/不透明像素的比例。做這個的最好方式是什麼？HTML5獲取畫布中alpha像素的數量

UPDATE：基於下面的帖子中，我結束了寫這個代碼：

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; 
}

來源

2012-01-31 andr111

如前所述，計數個體o帕克像素是做到這一點的唯一方法。

以下可能比其他答案中顯示的僞代碼更快。儘管有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); 
}

來源

2012-02-01 16:40:05 andrewmu

這比我的僞代碼快。最後一行是否指'alphaPixels'？ – paislee 2012-02-01 19:07:43

@paislee - 是的，謝謝你發現 – andrewmu 2012-02-01 20:17:17

當談到像素的畫布上，你別無選擇，只能抓住他們所有getImageData() - .data你結果是以RGBA順序的數據的字節數組。不要期望從這個偉大的表現，但如果這是你必須做的事情......

來源

2012-01-31 22:20:19

計數「舉起手來（僞）：

var alphaPixels, alpha, totalPixels 

for each pixel (x, y) 
    alpha = imageData.data[((y*(imageData.width*4)) + (x*4)) + 3] // <- real code 
    //         offset to alpha channel^
    if (alpha > 0) 
     alphaPixels++ 

return alphaPixels/totalPixels

參考

Pixel manipulation^MDN

來源

2012-01-31 22:30:25 paislee

HTML5獲取畫布中alpha像素的數量

回答

相關問題