Raphael一个用于在网页中绘制矢量图形的Javascript库


Posted in Javascript onJanuary 08, 2013

Raphael 是一个用于在网页中绘制矢量图形的 Javascript 库。它使用 SVG W3C 推荐标准和 VML 作为创建图形的基础,你可以通过 JavaScript 操作 DOM 来轻松创建出各种复杂的柱状图、饼图、曲线图等各种图表,还可以绘制任意形状的图形,可以进行图表或图像的裁剪和旋转等复杂操作。

Raphaël 是跨浏览器的矢量图形库,目前支持的浏览器包括: Firefox 3.0+,Safari 3.0+,Chrome 5.0+,Opera 9.5+ 以及 Internet Explorer 6.0+。
Raphael一个用于在网页中绘制矢量图形的Javascript库
如何使用?
在页面中引入 raphael.js 文件,然后就可以绘制任意的矢量图形了:

// 在坐标(10,50)创建宽320,高200的画布 
var paper = Raphael(10, 50, 320, 200); 
// 在坐标(x = 50, y = 40)绘制半径为 10 的圆 
var circle = paper.circle(50, 40, 10); 
// 给绘制的圆圈填充红色 (#f00) 
circle.attr("fill", "#f00"); 
// 设置画笔(stroke)的颜色为白色 
circle.attr("stroke", "#fff");
Javascript 相关文章推荐
Javascript中的数学函数集合
May 08 Javascript
Dom加载让图片加载完再执行的脚本代码
May 15 Javascript
javascript 文件的同步加载与异步加载实现原理
Dec 13 Javascript
Javascript堆排序算法详解
Dec 03 Javascript
AngularJS中指令的四种基本形式实例分析
Nov 22 Javascript
微信端开发--登录小程序步骤
Jan 11 Javascript
jquery ajaxfileupload异步上传插件使用详解
Feb 08 Javascript
微信小程序 页面跳转传值实现代码
Jul 27 Javascript
js 取消页面可以选中文字的功能方法
Jan 02 Javascript
详解react、redux、react-redux之间的关系
Apr 11 Javascript
js实现数字滚动特效
Dec 16 Javascript
利用node.js开发cli的完整步骤
Dec 29 Javascript
jquery插件珍藏(图片局部放大/信息提示框)
Jan 08 #Javascript
jquery Mobile入门—外部链接切换示例代码
Jan 08 #Javascript
jquery Moblie入门—hello world的示例代码学习
Jan 08 #Javascript
jquery Mobile入门—多页面切换示例学习
Jan 08 #Javascript
javascript 系统文件夹文件操作及参数介绍
Jan 08 #Javascript
12款经典的白富美型—jquery图片轮播插件—前端开发必备
Jan 08 #Javascript
滚动图片效果 jquery实现回旋滚动效果
Jan 08 #Javascript
You might like
PHP新手上路(十四)
2006/10/09 PHP
php中eval函数的危害与正确禁用方法
2014/06/30 PHP
ThinkPHP无限级分类原理实现留言与回复功能实例
2014/10/31 PHP
PHP封装的字符串加密解密函数
2015/12/18 PHP
javascript开发技术大全-第3章 js数据类型
2011/07/03 Javascript
Jquery弹出窗口插件 LeanModal的使用方法
2012/03/10 Javascript
jquery延迟加载外部js实现代码
2013/01/11 Javascript
鼠标滑过出现预览的大图提示效果
2014/02/26 Javascript
使用jquery选择器如何获取父级元素、同级元素、子元素
2014/05/14 Javascript
js+HTML5基于过滤器从摄像头中捕获视频的方法
2015/06/16 Javascript
深入探讨javascript函数式编程
2015/10/11 Javascript
jquery实现网页的页面平滑滚动效果代码
2015/11/02 Javascript
AngularJS Module方法详解
2015/12/08 Javascript
早该知道的7个JavaScript技巧
2016/06/21 Javascript
全面解析vue router 基本使用(动态路由,嵌套路由)
2018/09/02 Javascript
WEEX环境搭建与入门详解
2019/10/16 Javascript
微信小程序 scroll-view的使用案例代码详解
2020/06/11 Javascript
vue实现购物车的小练习
2020/12/21 Vue.js
[48:37]EG vs OG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
基于Python Shell获取hostname和fqdn释疑
2016/01/25 Python
Python利用ORM控制MongoDB(MongoEngine)的步骤全纪录
2018/09/13 Python
Python中创建二维数组
2018/10/17 Python
tensorflow mnist 数据加载实现并画图效果
2020/02/05 Python
html5移动端自适应布局的实现
2020/04/15 HTML / CSS
Dr. Martens马汀博士官网:马丁靴始祖品牌
2016/10/15 全球购物
澳大利亚购买最佳炊具品牌网站:Cookware Brands
2019/02/16 全球购物
本科生求职简历的自我评价
2013/10/21 职场文书
会计助理的岗位职责
2013/11/29 职场文书
革命先烈的英雄事迹材料
2014/02/15 职场文书
2014年中秋寄语
2014/08/11 职场文书
2014迎接教师节演讲稿
2014/09/10 职场文书
工作证明范本(2篇)
2014/09/14 职场文书
2015年教师见习期工作总结
2015/05/20 职场文书
(开源)微信小程序+mqtt,esp8266温湿度读取
2021/04/02 Javascript
能让Python提速超40倍的神器Cython详解
2021/06/24 Python
MySQ InnoDB和MyISAM存储引擎介绍
2022/04/26 MySQL