jw-animate-canvas
A react component for canvas integrated with animation feature. It is a combination of canvas and animator.
Install
Props
Prop | Description |
---|---|
maintainPixelSize (optional) |
whether the canvas should keep dimension from the moment it was created. Default: true |
onResize (optional) |
event handler when the canvas is being resized. |
contextType (optional) |
canvas context type. Default: "2d" |
animator (optional) |
the animator object for controlling the animation. If not provided, it will be created from within. |
animate (optional) |
animation method. Parameters: - context : canvas context- width : context width- height : context height- timeDiff : time difference between the last animate time (in seconds). |
Usage
;;; { superprops; thisresizeHandler = thisresizeHandler; thisanimate = thisanimate; } { const canvas = thismyCanvas; const animator = canvas; /** Start the animation. */ animatorstart; /** Pause the animation. */ animator; /** Resume the animation. */ animator; } { /** ... **/ } { /** ... **/ } { return <AnimateCanvas ref= thismyCanvas = myCanvas onResize=thisresizeHandler animate=thisanimate /> ; } ReactDOM;