<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Script/raphael.js"></script>
</head>
<body>
<div id="paper"> </div>
<script>
//创建一个画布
var paper = new Raphael("paper", 500, 500);
//画圆
paper.circle(50, 50, 50);
//画圆角方形
paper.rect(90, 90, 50, 50, 10);
</script>
</body>
</html>

这样一个简单的案例就完毕了。

简要说明:

new Raphael("paper", 500, 500);第一个參数是须要将画布加入到哪个容器里面,500,500各自是宽和高

circle(50, 50, 50)參数各自是,x,y,r直径

代码地址:https://coding.net/tommy-zhang/raphaeljs.git

效果图例如以下

Raphaeljs入门到精通(一)的更多相关文章

  1. Raphaeljs入门到精通(二)

    这节我们将介绍Raphaeljs中元素的属性和事件,案例还是以上一篇的代码展开 <!DOCTYPE html> <html xmlns="http://www.w3.org ...

  2. <程序员从入门到精通> -- How

    定位 自己才是职业生涯的管理者,想清楚自己的发展路径: 远期的理想是什么?近期的规划是什么?今日的任务和功课又是什么? 今日之任务或功课哪些有助于近期之规划的实现,而近期之规划是否有利于远期之理想? ...

  3. 【无私分享:从入门到精通ASP.NET MVC】从0开始,一起搭框架、做项目 目录索引

    索引 [无私分享:从入门到精通ASP.NET MVC]从0开始,一起搭框架.做项目(1)搭建MVC环境 注册区域 [无私分享:从入门到精通ASP.NET MVC]从0开始,一起搭框架.做项目(2)创建 ...

  4. ASP.NET MVC4入门到精通系列目录汇总

    序言 最近公司在招.NET程序员,我发现好多来公司面试的.NET程序员居然都没有 ASP.NET MVC项目经验,其中包括一些工作4.5年了,甚至8年10年的,许多人给我的感觉是:工作了4.5年,We ...

  5. Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引

    因为内容比较多,所以每篇讲解一些内容,最后会放出全部代码,可以参考.操作中总会遇到各式各样的问题,个人对部分问题的研究在最后一篇 问题研究 里.欢迎大家探讨学习. 代码都经过个人测试,但仍可能有各种未 ...

  6. 1、ASP.NET MVC入门到精通——新语法

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 在学习ASP.NET MVC之前,有必要先了解一下C#3.0所带来的新的语法特性,这一点尤为重要,因为在MVC项目中我们利用C#3.0的新特 ...

  7. 5、ASP.NET MVC入门到精通——NHibernate代码映射

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 上一篇NHibernate学习笔记—使用 NHibernate构建一个ASP.NET MVC应用程序 使用的是xml进行orm映射,那么这一 ...

  8. 6、ASP.NET MVC入门到精通——ASP.Net的两种开发方式

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 目前,ASP.NET中两种主流的开发方式是:ASP.NET Webform和ASP.NET MVC.从下图可以看到ASP.NET WebFo ...

  9. 7、ASP.NET MVC入门到精通——第一个ASP.NET MVC程序

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 开发流程 新建Controller 创建Action 根据Action创建View 在Action获取数据并生产ActionResult传递 ...

随机推荐

  1. win10关闭更新

    计算机--管理: 找到windows update 服务关闭:

  2. execlp(3) - Linux手册

    名称: execl, execlp, execle, execv, execvp, execvpe:执行文件 总览: #include <unistd.h> extern char **e ...

  3. nginx开启gzip压缩后导致apk包下载不能正常安装

    最后更新时间:2019/4/27 nginx一般都会开启gzip压缩,以提升传输性能. 配置如下: gzip on; gzip_comp_level 2; gzip_min_length 1k; gz ...

  4. shell 整数

    []     (())和[[]] -eq    == 或= -ne   != -gt    > -ge   >= -lt    < -le   <= [root@web02 ~ ...

  5. Linux入门基础二

    1.查看用户 who参数          说明 -a      打印能打印的全部 -d      打印死掉的进程 -m    同am i,mom likes -q      打印当前登录用户数及用户 ...

  6. Maven项目的坐标GroupId和ArtifactId

    GroupId和ArtifactId被统称为“坐标”是为了保证项目唯一性而提出的,如果你要把你项目弄到maven本地仓库去,你想要找到你的项目就必须根据这两个id去查找.       GroupId一 ...

  7. POJ——T3352 Road Construction

    http://poj.org/problem?id=3352 vis表示访问的次序 low的值相同的点在同一连通分量 #include <algorithm> #include <c ...

  8. 死锁的Dump文件

    死锁的Dump文件 package com.stono.thread; public class DeadLockDemo { private static String A = "A&qu ...

  9. Struts2学习(三)上传下载

    今天记录一下利用struts2实现上传下载,借此案例说明一下struts2的开发流程. 须要注意的是struts2版本号不同非常多地方的写法是不同的.本例使用struts2.3.15 .有差别的地方文 ...

  10. zoj 1655 单源最短路 改为比例+最长路

    http://acm.zju.edu.cn/onlinejudge/showProblem.do? problemId=655 没有理解清题意就硬套模板.所以WA了好几次. 解析看我的还有一篇http ...