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 相关文章推荐
js获取当前select 元素值的代码
Apr 19 Javascript
Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法
Jan 27 Javascript
javascript中强制执行toString()具体实现
Apr 27 Javascript
js获取所有checkbox的值的简单实例
May 30 Javascript
KnockoutJS 3.X API 第四章之click绑定
Oct 10 Javascript
在js中实现邮箱格式的验证方法(推荐)
Oct 24 Javascript
巧用Javascript的逻辑运算符
Dec 02 Javascript
EasyUI的TreeGrid的过滤功能的解决思路
Aug 08 Javascript
微信小程序switch组件使用详解
Jan 31 Javascript
angularJs中orderBy筛选以及filter过滤数据的方法
Sep 30 Javascript
JavaScript如何处理移动端拍摄图片旋转问题
Nov 16 Javascript
vue flex 布局实现div均分自动换行的示例代码
Aug 05 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
PHP5与MySQL数据库操作常用代码 收集
2010/03/21 PHP
PHP 时间日期操作实战
2011/08/26 PHP
php时区转换转换函数
2014/01/07 PHP
两级联动select刷新后其值保持不变的实现方法
2014/01/27 PHP
php输出xml属性的方法
2015/03/19 PHP
php处理带有中文URL的方法
2016/07/11 PHP
laravel框架模型和数据库基础操作实例详解
2020/01/25 PHP
PHP中类与对象功能、用法实例解读
2020/03/27 PHP
jQuery + Flex 通过拖拽方式动态改变图片的代码
2011/08/03 Javascript
JS异常处理的一个想法(sofish)
2013/03/14 Javascript
Ajax同步与异步传输的示例代码
2013/11/21 Javascript
介绍一个简单的JavaScript类框架
2015/06/24 Javascript
JS实现的自定义右键菜单实例二则
2015/09/01 Javascript
jQuery解析XML 详解及方法总结
2016/09/28 Javascript
JavaScript实现倒计时跳转页面功能【实用】
2016/12/13 Javascript
angularjs项目的页面跳转如何实现(5种方法)
2017/05/25 Javascript
如何以Angular的姿势打开Font-Awesome详解
2018/04/22 Javascript
解决vue初始化项目时,一直卡在Project description上的问题
2019/10/31 Javascript
Python字符串格式化
2015/06/15 Python
Python实现提取谷歌音乐搜索结果的方法
2015/07/10 Python
python3实现的zip格式压缩文件夹操作示例
2019/08/17 Python
Python中xml和dict格式转换的示例代码
2019/11/07 Python
什么是python的必选参数
2020/06/21 Python
python中 _、__、__xx__()区别及使用场景
2020/06/30 Python
100%有机精油,美容油:House of Pure Essence
2018/10/30 全球购物
在线实验室测试:HealthLabs.com
2020/05/03 全球购物
C语言中break与continue的区别
2012/07/12 面试题
RIP版本1跟版本2的区别
2013/12/30 面试题
介绍一下Make? 为什么使用make
2016/07/31 面试题
大一学生假期实习的自我评价
2013/10/12 职场文书
庆六一活动总结
2014/08/29 职场文书
毛主席纪念堂观后感
2015/06/17 职场文书
2016年推广普通话宣传周活动总结
2016/04/06 职场文书
SQLServer2008提示评估期已过解决方案
2021/04/12 SQL Server
golang通过递归遍历生成树状结构的操作
2021/04/28 Golang
python使用matplotlib绘制图片时x轴的刻度处理
2021/08/30 Python