Question

我正在做一个基于AlphaMaskFilter示例的刮刮/揭示游戏： http://createjs.com/demos/easeljs/AlphaMaskReveal.html

我想检测到面具完全消失，或者使用阈值（例如90％划痕）。

我阅读了有关AlphaMaskFilter，形状和图形对象的文档，我并不确定如何实现这一目标。

我甚至不确定我是否对像素信息有所了解并检查alpha通道来检测它，但即便如此，我想知道我是否会出现性能问题。

欢迎任何帮助，谢谢。

****编辑****添加到接受的答案****

所以，我能够使用AlphaMapFilter获得透明度（感谢Lanny）。 AlphaMapFilter为您提供了所有像素的Alpha通道的映射。这是一个适合我的示例代码：

        // mShapeToScratch is a createjs Shape. like in the http://createjs.com/demos/easeljs/AlphaMaskReveal.html example
        var alphaMaskFilter = new createjs.AlphaMapFilter(mShapeToScratch.cacheCanvas);
        var canvas = alphaMaskFilter.alphaMap;
        var ctx = canvas.getContext("2d");
        var imgData = ctx.getImageData(0, 0, canvas.width, canvas.height);
        var alphaData = imgData.data;
        var pixelTotal = rect.h*rect.w;
        var transparentPixel = 0;

        // rect.h is the height of the image and rect.w is the width not shown in the example
        for (var y = 0; y < rect.h; ++y)
        {
          for (var x=0; x < rect.w; ++x)
          {
            var pixelIdx = (y*rect.w + x);

            if(alphaData[pixelIdx] > 128) // transparent will be 255.
            {
                transparentPixel++;
            }
        }

        console.log("transparent % = " + transparentPixel/pixelTotal);

此示例检查所有像素，但很容易检查每个X像素一个，以加快检查，如Lanny建议。

Answer 1

alpha蒙版使用画布复合操作，而不是像素访问，所以如果没有一些完全自定义的方法，那么这不是一个很好的方法。

迭代像素（以AlphaMapFilter为例）可以工作 - 但可能相当慢。也许检查每隔4,10或25像素会加速它。

干杯。

如何在easeljs / createjs

1 个答案: