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中字符问题(二进制/十进制/十六进制及ASCII码之间的转换)
Nov 03 Javascript
jQuery中调用WebService方法小结
Mar 28 Javascript
js查错流程归纳
May 04 Javascript
jQuery滚动加载图片效果的实现
Mar 06 Javascript
Jqgrid设置全选(选择)及获取选择行的值示例代码
Dec 28 Javascript
一个JavaScript获取元素当前高度的实例
Oct 29 Javascript
轻量级javascript 框架Backbone使用指南
Jul 24 Javascript
jquery validation验证表单插件
Jan 07 Javascript
yarn的使用与升级Node.js的方法详解
Jun 04 Javascript
JavaScript中一些特殊的字符运算
Aug 17 Javascript
ES6使用Set数据结构实现数组的交集、并集、差集功能示例
Oct 31 Javascript
解决vue-router 二级导航默认选中某一选项的问题
Nov 01 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
第十二节 类的自动加载 [12]
2006/10/09 PHP
实用函数2
2007/11/08 PHP
php学习笔记 PHP面向对象的程序设计
2011/06/13 PHP
php实现在服务器端调整图片大小的方法
2015/06/16 PHP
php编程每天必学之表单验证
2016/03/01 PHP
PHP基于PDO调用sqlserver存储过程通用方法【基于Yii框架】
2017/10/07 PHP
php提供实现反射的方法和实例代码
2019/09/17 PHP
php判断目录存在的简单方法
2019/09/26 PHP
Jquery日历插件制作简单日历
2015/10/28 Javascript
全面解析Bootstrap表单使用方法(表单按钮)
2015/11/24 Javascript
实例讲解javascript注册事件处理函数
2016/01/09 Javascript
jQuery 常用代码集锦(必看篇)
2016/05/16 Javascript
JavaScript正则替换HTML标签功能示例
2017/03/02 Javascript
layui表单验证select下拉框实现验证的方法
2019/09/05 Javascript
vue cli3.0打包上线静态资源找不到路径的解决操作
2020/08/03 Javascript
JavaScript实现单点登录的示例
2020/09/23 Javascript
如何将Node.js中的回调转换为Promise
2020/11/10 Javascript
[03:44]2014DOTA2国际邀请赛 71专访:DK战队赛前讨论视频遭泄露
2014/07/13 DOTA
python3使用PyMysql连接mysql数据库实例
2017/02/07 Python
实用自动化运维Python脚本分享
2018/06/04 Python
python面试题小结附答案实例代码
2019/04/11 Python
Python实现蒙特卡洛算法小实验过程详解
2019/07/12 Python
Django中的静态文件管理过程解析
2019/08/01 Python
在pycharm中配置Anaconda以及pip源配置详解
2019/09/09 Python
Python对wav文件的重采样实例
2020/02/25 Python
python打开文件的方式有哪些
2020/06/29 Python
django rest framework使用django-filter用法
2020/07/15 Python
HTML5+css3:3D旋转木马效果相册
2017/01/03 HTML / CSS
The Athlete’s Foot新西兰:新西兰最大的运动鞋零售商
2019/12/23 全球购物
兰兰过桥教学反思
2014/02/08 职场文书
个人函授自我鉴定
2014/03/25 职场文书
2014领导班子专题民主生活会对照检查材料思想汇报
2014/09/23 职场文书
个人欠款协议书范本2014
2014/11/02 职场文书
canvas绘制折线路径动画实现
2021/05/12 Javascript
SpringCloud Function SpEL注入漏洞分析及环境搭建
2022/04/08 Java/Android
vue3语法糖内的defineProps及defineEmits
2022/04/14 Vue.js