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

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.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");

时间: 2024-08-01 12:41:20

Raphael一个用于在网页中绘制矢量图形的Javascript库_jquery的相关文章

同一个网页中实现多个JavaScript特效的方法_javascript技巧

本文实例讲述了同一个网页中实现多个JavaScript特效的方法.分享给大家供大家参考.具体分析如下: 一般来说,在网页中,如果出现两次<script type="text/javascript"></script>标签,所有的JavaScipt脚本都不会再生效,只能出现一次<script type="text/javascript"></script>标签,但是,同一个网页中常常需要多个JavaScript特效. 一

在网页中动态的生成一个gif图片

大家知道股票网站的K线图是动态生成的定时刷新PHP 就有动态生成图片的功能     那么怎样用asp.net在网页中动态的生成一个图片呢?     下面我要举的例子是动态的生成一个图片显示当前时间     namespace Wmj     {     using System;     using System.Drawing;     using System.Web.UI;           public class MyTempImage : Page      {      publ

《HTML5 开发实例大全》——1.25 使用&lt; object &gt;元素在网页中显示一个Flash

1.25 使用< object >元素在网页中显示一个Flash https://yqfile.alicdn.com/6f177bb72335e09f2608ee497c26d2a632c309e2.png" > 实例说明 本实例的功能是,使用< object >元素在网页中显示一个Flash,本实例的素材Flash文件是123.swf.在HTML 5 中,< object >元素的功能是定义一个嵌入的对象.请使用此元素向您的 XHTML 页面添加多媒体

PS网页设计教程XXI——在Photoshop中创建一个光质感网页设计

作为编码者,美工基础是偏弱的.我们可以参考一些成熟的网页PS教程,提高自身的设计能力.套用一句话,"熟读唐诗三百首,不会作诗也会吟". 本系列的教程来源于网上的PS教程,都是国外的,全英文的.本人尝试翻译这些优秀的教程.因为翻译能力有限,翻译的细节上还有待推敲,希望广大网友不吝赐教. 约定: 1.本文的软件是Photoshop CS5版本 2.原教程的截图是英文的,本人在重新制作的基础上,重新截了中文版的图 3.原文中有些操作没有给出参数.本人在反复测试的情况下测定了一些参数,以红色的

jsp中调用上一个网页中调用的js里面的input text的值

问题描述 jsp中调用上一个网页中调用的js里面的input text的值 套了一个时间选择的模板,想要获取开始时间和结束时间,但是这两个出现在调用的js里面,怎么获取 解决方案 将控件绑定id,js中有通过id设置控件内容的方法 解决方案二: 当前网页和上一个网页是什么关系?iframe还是window.open? iframe可以用parent或者document.getElementById('ifrID').contentWindow得到相互引用, window.open用opener或

在网页中调用一个flash动画,图片有黑边怎么去除?

问题描述 在网页中调用一个flash动画,图片有黑边怎么去除?

ios-IOS中绘制一个思考图案

问题描述 IOS中绘制一个思考图案 在IOS中要绘制一个思考泡泡填充图片.用了很多方法都没实现,请高手帮忙. 图片如下: 谢谢 解决方案 只要能知道各个点的位置及控制点.绘制弧度应该能够画出来. void CGContextAddArc ( CGContextRef c, CGFloat x, //圆心的x坐标 CGFloat y, //圆心的x坐标 CGFloat radius, //圆的半径 CGFloat startAngle, //开始弧度 CGFloat endAngle, //结束弧

请教大神,android中我需要在自定义控件中绘制一个透明的小三角行?

问题描述 请教大神,android中我需要在自定义控件中绘制一个透明的小三角行? 请教大神,android中我需要在自定义控件中绘制一个透明的小三角行,比如我需要在LinearLayout的底部绘制一个透明背景小三角,该怎么绘制呢? 我在绘制的时候将设置成透明背景,绘制小三角不显示,必须要给他设置一个背景才会显示,纠结啊 解决方案 可以定义一个path吧,连接成一个三角形,然后画出来 解决方案二: 让UI给你做一个三角形的透明图 设为背景 解决方案三: path连接成个三角形的话,如果这个自定义

MFC在登陆页面中 加一个显示验证码的控件应该加哪个?图片从一个网页中加载出来的

问题描述 MFC在登陆页面中 加一个显示验证码的控件应该加哪个?图片从一个网页中加载出来的 http://202.200.144.63/(gac14yvwcsjrzj45cx1fq4ed)/CheckCode.aspx 我想把这网页里的图片显示在登陆界面作为验证码,请问我该在对话框中加什么控件,我用的是下边的方法 CHtmlView* pView= (CHtmlView*)m_wndSplit.GetPane(0,1); pView->Navigate("http://hao.201201