createjs mask a Bitmap with another Bitmap

1
votes

I'm trying to mask a Bitmap object with another Bitmap, but so far with actual success.
There's a jsfiddle by Lanny, but it involves a Shape object being the mask, so my questions are:

  1. Can you use an alpha channel from another bitmap to mask a createjs Bitmap object?
  2. Is it possible to use an alpha channel from a png image as a mask?
1
htmlcreatejseaseljs
the docs say mask can be only a Shape - www0z0k
what about AlphaMaskFilter? - bks

1 Answers

1
votes

@bks's comment is correct. You can use AlphaMaskFilter to use one image to mask another.

From the docs: http://createjs.com/docs/easeljs/classes/AlphaMaskFilter.html

 var bmp = new createjs.Bitmap("path/to/image.jpg");
 bmp.filters = [
     new createjs.AlphaMaskFilter(box.cacheCanvas)
 ];
 bmp.cache(0, 0, 100, 100);

Ensure you cache the bitmap after applying the filter. Keep in mind filters can be slow, so don't update it every frame.

Cheers.