JCanvas: As we know that canvas is used to draw graphics with the help of javascript. In this there are certain properties to draw a line, circle, box, etc but canvas does not support event handlers.
JCanvas is a javascript library which is written in JQuery, it wraps around the HTML and and add new featues, capabilities like animation, drag-drop, events handlers, etc to it. Also we can extend JCanvas with our own methods and properties using extend() function.
Example:
HTML:
<canvas width="300" height="150" style="border:1px solid #000"></canvas>
SCRIPT:
$("canvas").drawArc({
draggable: true,
fillStyle: "green",
x: 100, y: 100,
radius: 50
});
Also, we have to include the the attached jcanvas.min.js and jquery.min.js file to make it work.
There are many supported events in Jcanvas:
drawRect()
drawArc()
drawBezier()
drawVector()
drawGraph()
drawPolygon()
drawImage()
drawText()
drawEllipse()
drawLine()
drawQuadratic()
animateLayer()
drawSlice()
Also many event handlers:
click
dblclick
dragstart
drag
dragstop
touchstart
touchend
touchmove
mousedown
mouseup
mousemove
mouseover
mouseout
This is will make your Canvas/Graphics much more interactive and compatible with the events.
0 Comment(s)