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 相关文章推荐
jquery中focus()函数实现当对象获得焦点后自动把光标移到内容最后
Sep 29 Javascript
JS实现模仿微博发布效果实例代码
Dec 16 Javascript
js判断浏览器类型为ie6时不执行
Jun 15 Javascript
JavaScript学习笔记之JS事件对象
Jan 22 Javascript
浅谈javascript中for in 和 for each in的区别
Apr 23 Javascript
javascript实现链接单选效果的方法
May 13 Javascript
JavaScript实现Flash炫光波动特效
May 14 Javascript
jQuery中show与hide方法用法示例
Sep 16 Javascript
12 款 JS 代码测试必备工具(翻译)
Dec 13 Javascript
使用jquery+iframe做一个ajax上传效果(实例)
Aug 24 jQuery
react实现antd线上主题动态切换功能
Aug 12 Javascript
vant实现购物车功能
Jun 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
URL Rewrite的设置方法
2007/01/02 PHP
一些被忽视的PHP函数(简单整理)
2010/04/30 PHP
PHP面向接口编程 耦合设计模式 简单范例
2011/03/23 PHP
关于二级目录拖拽排序的实现(源码示例下载)
2013/04/26 PHP
PHP面向对象程序设计之命名空间与自动加载类详解
2016/12/02 PHP
CSS心形加载的动画源码的实现
2021/03/09 HTML / CSS
js对象的复制继承实例
2015/01/10 Javascript
js实现图片上传并正常显示
2015/12/19 Javascript
js仿百度登录页实现拖动窗口效果
2016/03/11 Javascript
简单的JS轮播图代码
2016/07/18 Javascript
浅析Node.js实现HTTP文件下载
2016/08/05 Javascript
各式各样的导航条效果css3结合jquery代码实现
2016/09/17 Javascript
简单实现node.js图片上传
2016/12/18 Javascript
React Native中Navigator的使用方法示例
2017/10/13 Javascript
JS实现运动缓冲效果的封装函数示例
2018/02/18 Javascript
解决vue2.0动态绑定图片src属性值初始化时报错的问题
2018/03/14 Javascript
vue.js将时间戳转化为日期格式的实现代码
2018/06/05 Javascript
vue 本地环境跨域请求proxyTable的方法
2018/09/19 Javascript
支付宝小程序自定义弹窗dialog插件的实现代码
2018/11/30 Javascript
微信小程序简单的canvas裁剪图片功能详解
2019/07/12 Javascript
JS 事件机制完整示例分析
2020/01/15 Javascript
django站点管理详解
2017/12/12 Python
代码分析Python地图坐标转换
2018/02/08 Python
详解Python中的分组函数groupby和itertools)
2018/07/11 Python
Python3实现汉语转换为汉语拼音
2019/07/08 Python
python自定义时钟类、定时任务类
2021/02/22 Python
python操作微信自动发消息的实现(微信聊天机器人)
2020/07/14 Python
Python析构函数__del__定义原理解析
2020/11/20 Python
英国标准协会商店:BSI Shop
2019/02/25 全球购物
英国川宁茶官方网站:Twinings茶
2019/05/21 全球购物
绩效专员岗位职责
2013/12/02 职场文书
平安校园建设方案
2014/05/02 职场文书
2015年社区党务工作总结
2015/04/21 职场文书
springboot layui hutool Excel导入的实现
2022/03/31 Java/Android
单机多实例部署 MySQL8.0.20
2022/05/15 MySQL