raphael画图
// 在坐标(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"
);
//高600 宽600 直角坐标系
paper
.path("M0 0 V600,H600");
//M = moveto 参数:(x y) // 移动到
//L = lineto 参数:(x y) //直线
//H = horizontal lineto 参数:(x) //水平
//V = vertical lineto 参数:(y) //垂直
//C = curveto 参数:(x1 y1 x2 y2 x y) //弧线
//S = smooth curveto 参数:(x2 y2 x y) //光滑的弧线
//Q = quadratic Belzier curve 参数:(x1 y1 x y) //二次贝塞尔曲线曲线
//T = smooth quadratic Belzier curveto 参数:(x y) //光滑二次贝塞尔曲线曲线
//A = elliptical Arc 参数:(rx ry x-axis-rotation large-arc-flag sweep-flag x y) //椭圆弧
//Z = closepath 参数(none) //闭合
raphael画图的更多相关文章
- 使用Raphael 画图(二) 扩展的图形 (javascript)
看这文章前,建议先看第一编文章<使用Raphael 画图(一) 基本图形 (javascript)>. 在Raphael基础上扩展的图形: 要运行该例子要引入附件的2个js包.(g.rap ...
- 对Raphael画图标的一个jquery简单封装
公司要做一个项目的demo,要求地图上可以插红旗,所以就用到了Raphael. 因为是个demo,所以地图就用了一张图片,效果如下: 所以为了更好的封装一下这个功能,就写了一个简单的插件:jquery ...
- 使用Raphael 画图(一) 基本图形 (javascript)
Raphael是什么? Raphael 是一个用于在网页中绘制矢量图形的 Javascript 库.它使用 SVG W3C 推荐标准和 VML 作为创建图形的基础,你可以通过 JavaScript 操 ...
- 利用raphael画图
raphael是一个js的矢量库,可以js操作DOM可以实现柱形图.走势图等一些基本的图形: 一.使用: 在html中设置<div class="my"></di ...
- 使用Raphael 画图(四) 路径(一) (javascript)
这章介绍路径,本人觉得这是比较难和精髓的一部分. 先介绍基本知识: 可以参考: http://www.chinasvg.com/support/svg-tutorial/svg-path-direct ...
- 使用Raphael 画图(三) 事件 (javascript)
这章展示事件例子. 下图是官方API的事件: 例子: var butt1 = paper.set(); var a1 = paper.circle(24.833, 26.917, 26.667).at ...
- jquery简单封装
对Raphael画图标的一个jquery简单封装 公司要做一个项目的demo,要求地图上可以插红旗,所以就用到了Raphael. 因为是个demo,所以地图就用了一张图片,效果如下: 所以为了更好的封 ...
- raphael入门到精通---入门篇之总览
什么是Raphael raphael.js是一小巧的javascript库,它可以在web上画矢量图简化你的工作,如果你想创建你指定的图表,图形区域或者可移动的组件,那么就使用raphael吧 话不多 ...
- Raphael Js矢量库API简介:
Raphael Js矢量库API简介:Raphael Javascript 是一个 Javascript的矢量库. 2010年6月15日,著名的JavaScript库ExtJS与触摸屏代码库项目jQT ...
随机推荐
- Codeforces Round #306 (Div. 2) C. Divisibility by Eight 暴力
C. Divisibility by Eight Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/ ...
- andorid 中如何实现双击事件
项目需求: android中只有单击和其他事件,其实都是由OnTouch事件演变而来:最近有项目要求双击全屏,所以就试着实现了下 具体实现如下: 1.MainActivity.java实现: publ ...
- Android6.0动态权限申请步骤以及需要注意的一些坑
因为工作需要,简单研究了一下Android6.0权限申请,在Google提供的sample的基础上,写了一个简单的demo.算是自己的笔记吧,可能会比较混乱,主要是方便以后查看.后期有别的问题,随时更 ...
- andorid
js内存泄露 三分面加七分水 —— 十分糊涂 膝盖上打瞌睡 —— 自己靠自己 不当家,不知柴米贵:不生子,不知父母恩. 水落现石头,日久见人心. sqllite http://wenku.baidu. ...
- linux php安装扩展方法 查找配置文件
如何在linux中查看nginx.apache.php.mysql配置文件路径了,如果你接收一个别人配置过的环境,但没留下相关文档.这时该怎么判断找到正确的加载文件路径了.可以通过以下来判断 1.判断 ...
- MySQL ALTER语法的运用方法 && 操作索引和字段
语法:alter_specification: ADD [COLUMN] create_definition [FIRST | AFTER column_name ] or ADD INDEX [in ...
- 1.4.1.Documents,Fields和Schema概述
Documents,Fields和Schema概述 solr的基本前提是非常简单,你可以给它很多信息,然后可以向它提出问题,获取你想要的问题的信息.所有信息输入的地方就叫做索引或者更新.当你提出问题时 ...
- iOS 生成随机数 重复 不重复
//编程的时候,有三条任选执行路径,都会显示一些图片,比如路径1显示的图片是一个人,路径2显示的是两个人,路径3显示任意人数的图片,要求每次进入该页面都不能重复初始的那张图片. 于是我想到了 运用随机 ...
- 用bootstrapValidator来验证UEditor
我们的项目使用了bootstrapValidator来作为前端校验,但是表单里面有一个UEditor,它用bootstrapValidator是没有效果的,为了页面风格统一,只好修修改改咯 首先来看一 ...
- 【Shell脚本学习21】Shell break和continue命令
在循环过程中,有时候需要在未达到循环结束条件时强制跳出循环,像大多数编程语言一样,Shell也使用 break 和 continue 来跳出循环. break命令 break命令允许跳出所有循环(终止 ...