API Documentation for: 0.8.2
Show:

AlphaMaskFilter Class

Extends Filter
Defined in: AlphaMaskFilter:41
Module: EaselJS

Applies the alpha from the mask image (or canvas) to the target, such that the alpha channel of the result will be derived from the mask, and the RGB channels will be copied from the target. This can be used, for example, to apply an alpha mask to a display object. This can also be used to combine a JPG compressed RGB image with a PNG32 alpha mask, which can result in a much smaller file size than a single PNG32 containing ARGB.

IMPORTANT NOTE: This filter currently does not support the targetCtx, or targetX/Y parameters correctly.

Example

This example draws a gradient box, then caches it and uses the "cacheCanvas" as the alpha mask on a 100x100 image.

 var box = new createjs.Shape();
 box.graphics.beginLinearGradientFill(["#000000", "rgba(0, 0, 0, 0)"], [0, 1], 0, 0, 100, 100)
 box.graphics.drawRect(0, 0, 100, 100);
 box.cache(0, 0, 100, 100);

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

See Filter for more information on applying filters.

Constructor

AlphaMaskFilter

(
  • mask
)

Defined in AlphaMaskFilter:41

Parameters:

  • mask HTMLImageElement | HTMLCanvasElement

Item Index

Properties

Methods

_applyFilter

(
  • imageData
)
Boolean

Inherited from Filter: _applyFilter:147

Parameters:

  • imageData ImageData

    Target ImageData instance.

Returns:

applyFilter

(
  • ctx
  • x
  • y
  • width
  • height
  • [targetCtx]
  • [targetX]
  • [targetY]
)
Boolean

Inherited from Filter but overwritten in applyFilter:87

Applies the filter to the specified context.

IMPORTANT NOTE: This filter currently does not support the targetCtx, or targetX/Y parameters correctly.

Parameters:

  • ctx CanvasRenderingContext2D

    The 2D context to use as the source.

  • x Number

    The x position to use for the source rect.

  • y Number

    The y position to use for the source rect.

  • width Number

    The width to use for the source rect.

  • height Number

    The height to use for the source rect.

  • [targetCtx] CanvasRenderingContext2D optional

    NOT SUPPORTED IN THIS FILTER. The 2D context to draw the result to. Defaults to the context passed to ctx.

  • [targetX] Number optional

    NOT SUPPORTED IN THIS FILTER. The x position to draw the result to. Defaults to the value passed to x.

  • [targetY] Number optional

    NOT SUPPORTED IN THIS FILTER. The y position to draw the result to. Defaults to the value passed to y.

Returns:

Boolean:

If the filter was applied successfully.

clone

() Filter

Inherited from Filter: clone:137

Returns a clone of this Filter instance.

Returns:

Filter:

A clone of the current Filter instance.

getBounds

(
  • [rect]
)
Rectangle

Inherited from Filter: getBounds:88

Provides padding values for this filter. That is, how much the filter will extend the visual bounds of an object it is applied to.

Parameters:

  • [rect] Rectangle optional

    If specified, the provided Rectangle instance will be expanded by the padding amounts and returned.

Returns:

Rectangle:

If a rect param was provided, it is returned. If not, either a new rectangle with the padding values, or null if no padding is required for this filter.

initialize

() deprecated protected

Inherited from Filter: initialize:73

REMOVED. Removed in favor of using MySuperClass_constructor. See extend and promote for details.

There is an inheritance tutorial distributed with EaselJS in /tutorials/Inheritance.

toString

() String

Inherited from Filter: toString:128

Returns a string representation of this object.

Returns:

String:

a string representation of the instance.

Properties

mask

HTMLImageElement | HTMLCanvasElement

Defined in mask:73

The image (or canvas) to use as the mask.