Home

robhawkes edited this page Sep 13, 2010 · 7 revisions
Clone this wiki locally

Here are some simple examples until proper documentation is produced.

Using the $.fn.canvas() method will turn the defined tag into a <canvas> element…

$(element).canvas();

From then on you can use any of the plugin’s drawing methods to manipulate the <canvas>. The following example would draw a simple rectangle 20px from the top, 50px from the left, 30px wide and 70px tall…

$(canvasElement).fillRect({x: 20, y: 50, height: 70, width: 30});

If required you can chain the creation of the <canvas> with drawing commands, or just chain drawing commands themselves…

$(element).canvas().fillRect({x: 20, y: 50, height: 70, width: 30});
$(canvasElement).fillArc({x: 20, y: 20, radius: 50}).fillRect({x: 150, y: 200, height: 30, width: 30});