Canvas

Events

Draw [Data: {type: "canvas", pos, co, ctx}]
when the entity is ready to be drawn to the stage
NoCanvas
if the browser does not support canvas

When this component is added to an entity it will be drawn to the global canvas element. The canvas element (and hence all Canvas entities) is always rendered below any DOM entities.

Crafty.canvas.init() will be automatically called if it is not called already to initialize the canvas element.

Create a canvas entity like this

var myEntity = Crafty.e("2D, Canvas, Color").color("green")
                                            .attr({x: 13, y: 37, w: 42, h: 42});
Back to top

.draw

public this .draw([[Context ctx, ]Number x, Number y, Number w, Number h])

ctx
Canvas 2D context if drawing on another canvas is required
x
X offset for drawing a segment
y
Y offset for drawing a segment
w
Width of the segment to draw
h
Height of the segment to draw

Method to draw the entity on the canvas element. Can pass rect values for redrawing a segment of the entity.