![](http://dl.iteye.com/upload/attachment/505383/2b05de66-ccdc-3995-a1ff-84c894ce0492.jpg)
jCanvaScript 1.4.0 正式版本发布了。
jCanvaScript是一个面向HTML5画布(canvas)的Javascript类库,它提供了许多方法用于简化处理HTML5画布(canvas)元素的内容,只要支持canvas和Javascript的浏览器都可以使用它,包括iPhone、iPad和Android等平台。
jCanvaScript主要特点:
•完全面向对象
•支持对canvas环境的操作
•支持对象的鼠标事件
•支持对象的键盘事件
•拖拽支持
•提供对象管理的简易方法
•支持简单的对象动画
该版本的更新:
•Image对象发生了变化。参数sx,sy, swidth, sheight变成了x, y, width, height.
•arc 对象发生了变化,现在考虑到了degree。
•新增了 .getRect() 和.position()功能。
•运行在mouseover 和 mouseout事件上的功能,像鼠标事件的其它功能等,用鼠标光标坐标对象作为参数了。
•现在新增了jc.addFunction() 功能,支持在jCanvaScript对象中添加自定义的方法。
•在 jc.addObject()功能中新增了继承的功能。
•在imageData对象中新增了.filter()功能,也有可能用jc.addImageDataFilter()方法来添加自定义的过滤器。默认的颜色过滤器包括红,蓝,绿,线性过滤器包括'sharp'和’blur’两种类型。
如何使用:
1.使用jCanvaScript类库进行图形绘制与其它类库的使用并无区别,首先引入jCanvaScript.js
引用
<script src="jCanvaScript.js" type="text/javascript"> </script>
2.然后,创建canvas元素:
引用
<canvas height="200" width="500" id="csser_canvas"></canvas>
3.接下来就可以使用jc提供的API进行图形对象的绘制,注意其绘制流程:
引用
// 根据画布ID初始化
jc.start('csser_canvas');
// 然后绘制图形对象
jc.circle(100,100,50,'rgba(255,0,0,0.5)',1);
// 继续绘制另一个图形,并让它有翻转效果
jc.rect(150,40,50,60,1).rotate(30,'center');
// 注意最后需要重绘画布一下
jc.start('csser_canvas');
官网地址:
http://jcscript.com/
jc.start('csser_canvas');
// 然后绘制图形对象
jc.circle(100,100,50,'rgba(255,0,0,0.5)',1);
// 继续绘制另一个图形,并让它有翻转效果
jc.rect(150,40,50,60,1).rotate(30,'center');
// 注意最后需要重绘画布一下
jc.start('csser_canvas');
下载地址: http://jcscript.com/downloads