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 09 Javascript
jQuery实现倒计时按钮功能代码分享
Sep 03 Javascript
JS+CSS实现的简单折叠展开多级菜单效果
Sep 12 Javascript
javascript判断复选框是否选中的方法
Oct 16 Javascript
JavaScript数据存储 Cookie篇
Jul 02 Javascript
jquery获取easyui日期控件的值实现方法
Nov 09 Javascript
详解Vue.use自定义自己的全局组件
Jun 14 Javascript
对存在JavaScript隐式类型转换的四种情况的总结(必看篇)
Aug 31 Javascript
JS简单实现点击跳转登陆邮箱功能的方法
Oct 31 Javascript
JQuery搜索框自动补全(模糊匹配)功能实现示例
Jan 08 jQuery
js回调函数仿360开机
Dec 26 Javascript
原生js实现自定义滚动条
Jan 20 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环境配置之CGI、FastCGI、PHP-CGI、PHP-FPM、Spawn-FCGI比较?
2011/10/17 PHP
php发送get、post请求的6种方法简明总结
2014/07/08 PHP
JavaScript入门教程(1) 什么是JS
2009/01/31 Javascript
jquery中ajax学习笔记4
2011/10/16 Javascript
JS弹出层单纯的绝对定位居中示例代码
2014/02/18 Javascript
使用javascript实现Iframe自适应高度
2014/12/24 Javascript
JavaScript+html5 canvas制作的圆中圆效果实例
2016/01/27 Javascript
JS触摸屏网页版仿app弹窗型滚动列表选择器/日期选择器
2016/10/30 Javascript
JS调用Android、Ios原生控件
2017/01/06 Javascript
vue双向数据绑定原理探究(附demo)
2017/01/17 Javascript
vue2.X组件学习心得(新手必看篇)
2017/07/05 Javascript
基于js的变量提升和函数提升(详解)
2017/09/17 Javascript
vue滚动轴插件better-scroll使用详解
2017/10/17 Javascript
vue项目中公用footer组件底部位置的适配问题
2018/05/10 Javascript
深入理解js 中async 函数的含义和用法
2018/05/13 Javascript
angular 实现的输入框数字千分位及保留几位小数点功能示例
2018/06/19 Javascript
element-ui循环显示radio控件信息的方法
2018/08/24 Javascript
Angular单元测试之事件触发的实现
2020/01/20 Javascript
vue使用require.context实现动态注册路由
2020/12/25 Vue.js
Python的条件语句与运算符优先级详解
2015/10/13 Python
Python中内建函数的简单用法说明
2016/05/05 Python
python3使用pyqt5制作一个超简单浏览器的实例
2017/10/19 Python
Python数据预处理之数据规范化(归一化)示例
2019/01/08 Python
python 使用socket传输图片视频等文件的实现方式
2019/08/07 Python
python使用docx模块读写docx文件的方法与docx模块常用方法详解
2020/02/17 Python
英国比较机场停车场网站:Airport Parking Essentials
2019/12/01 全球购物
白酒市场开发计划书
2014/01/09 职场文书
晚宴邀请函范文
2014/01/15 职场文书
岗位职责的构建方法
2014/02/01 职场文书
孝敬父母的活动方案
2014/08/31 职场文书
田径运动会通讯稿
2014/09/13 职场文书
幼儿园开学家长寄语(2015秋季)
2015/05/27 职场文书
Python编程根据字典列表相同键的值进行合并
2021/10/05 Python
python程序的组织结构详解
2021/12/06 Python
vue route新窗口跳转页面并且携带与接收参数
2022/04/10 Vue.js
Python采集爬取京东商品信息和评论并存入MySQL
2022/04/12 Python