BlurFilter Class
Applies a box blur to DisplayObjects in context 2D and a Gaussian blur in webgl. Note that this filter is fairly intensive, particularly if the quality is set higher than 1.
Example
This example creates a red circle, and then applies a 5 pixel blur to it. It uses the getBounds method to account for the spread that the blur causes. var shape = new createjs.Shape().set({x:100,y:100});
shape.graphics.beginFill("#ff0000").drawCircle(0,0,50);
var blurFilter = new createjs.BlurFilter(5, 5, 1);
shape.filters = [blurFilter];
var bounds = blurFilter.getBounds();
shape.cache(-50+bounds.x, -50+bounds.y, 100+bounds.width, 100+bounds.height);See Filter for an more information on applying filters.
Constructor
Item Index
Properties
- _multiPass
- blurX
- blurY
- FRAG_SHADER
- MUL_TABLE static
- quality
- SHG_TABLE static
- usesContext
- VTX_SHADER
Methods
_applyFilter
-
imageData
Parameters:
-
imageDataImageDataTarget ImageData instance.
Returns:
_getTable
-
spread
Internal lookup function to create gaussian distribution.
Parameters:
-
spreadNumberHow many steps in the curve.
Returns:
An array with Math.ceil(spread*2) entries with appropriately distributed weights.
_updateShader
()
Internal update function to create shader properties.
applyFilter
-
ctx -
x -
y -
width -
height -
[targetCtx] -
[targetX] -
[targetY]
Applies the filter to the specified context.
Parameters:
-
ctxCanvasRenderingContext2DThe 2D context to use as the source.
-
xNumberThe x position to use for the source rect.
-
yNumberThe y position to use for the source rect.
-
widthNumberThe width to use for the source rect.
-
heightNumberThe height to use for the source rect.
-
[targetCtx]CanvasRenderingContext2D optionalThe 2D context to draw the result to. Defaults to the context passed to ctx.
-
[targetX]Number optionalThe x position to draw the result to. Defaults to the value passed to x.
-
[targetY]Number optionalThe y position to draw the result to. Defaults to the value passed to y.
Returns:
If the filter was applied successfully.
clone
()
Filter
Returns a clone of this Filter instance.
Returns:
A clone of the current Filter instance.
getBounds
-
[rect]
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 optionalIf specified, the provided Rectangle instance will be expanded by the padding amounts and returned.
Returns:
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.
shaderParamSetup
-
gl -
stage -
shaderProgram
Assign any unique uniforms or other setup functionality here.
Parameters:
-
glWebGLContextThe context associated with the stage performing the render.
-
stageStageGLThe stage instance that will be rendering.
-
shaderProgramShaderProgramThe compiled shader that is going to be used to perform the render.
Properties
_multiPass
Filter
private
Another filter that is required to act as part of this filter and created and managed under the hood.
Default: null
FRAG_SHADER
String
readonly
Pre-processed template shader code. It will be parsed before being fed in into the shader compiler. This should be based upon StageGL.SHADER_FRAGMENT_BODY_REGULAR
quality
Number
Number of blur iterations. For example, a value of 1 will produce a rough blur. A value of 2 will produce a smoother blur, but take twice as long to run.
Default: 1
usesContext
Boolean
A flag stating that this filter uses a context draw mode and cannot be batched into imageData processing.
Default: false
VTX_SHADER
String
readonly
Pre-processed template shader code. It will be parsed before being fed in into the shader compiler. This should be based upon StageGL.SHADER_VERTEX_BODY_REGULAR