1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.     <title></title>
  5.     <script src="Script/raphael.js"></script>
  6. </head>
  7. <body>
  8.     <div id="paper">
  9.  
  10.     </div>
  11.     <script>
  12.         //创建一个画布
  13.         var paper = new Raphael("paper", 500, 500);
  14.         //画圆
  15.         paper.circle(50, 50, 50);
  16.         //画圆角方形
  17.         paper.rect(90, 90, 50, 50, 10);
  18.     </script>
  19. </body>
  20. </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. wordpress 后台登录增加访问效验

    目前已知的增加 wordpress 后台登录安全的方案有三种: 安全插件:如Limit Login Attempts Reloaded.WPS Hide Login 等等: 登录 URL 增加自定义k ...

  2. luogu P4062 [Code+#1]Yazid 的新生舞会（线段树+套路）

    今天原来是平安夜啊 感觉这题是道好题. 一个套路枚举权值\(x\),把权值等于\(x\)的设为1,不等于的设为-1,然后问题转化为多少个区间权值和大于. 发现并不是很好做,还有一个套路,用前缀和查分来 ...

  3. C语言Huffman压缩和解压

    符号表结构体: struct node { // 字符串形式存储的Huffman编码 char code[MAX_CODE_LENGTH]; // 这个字符在文件中出现的次数 long count; ...

  4. 紫书 例题 11-14 UVa 1279 （动点最小生成树）（详细解释）

    这道题写了好久-- 在三维空间里面有动的点, 然后求有几次最小生成树. 其实很容易发现, 在最小生成树切换的时候,在这个时候一定有两条边相等, 而且等一下更大的那条边在最小生成树中,等一下更小的边不在 ...

  5. 题解 洛谷 P4047 【[JSOI2010]部落划分】

    我觉得几乎就是一道最小生成树模板啊... 题解里许多大佬都说选第n-k+1条边,可我觉得要这么讲比较容易理解 (虚边为能选的边,实边为最小生成树) 令n=5,k=2,(1,3)<(1,2)< ...

  6. word break相关问题的解法

    https://leetcode.com/problems/word-break/?tab=Description 以及 https://leetcode.com/problems/concatena ...

  7. Activity生命周期的运行流程

    Activity的生命周期运行流程:  ·当Activity第1次被启动:     ·onCreate()->onStart()->onResume()  ·当Activity被遮挡后再次 ...

  8. MySQl Study学习之--MySQl二进制日志管理

    MySQl Study学习之--MySQl二进制日志管理 MySQL二进制日志(Binary Log)   a.它包括的内容及作用例如以下:     包括了全部更新了数据或者已经潜在更新了数据(比方没 ...

  9. 芒果TV真实视频地址解析

    本文旨在互相学习,请勿滥用 若有幸被您引用请附加地址来源http://blog.csdn.net/feige2008/article/details/37579051 文章主要解析芒果TV的视频真实地 ...

  10. linux 抓包 tcpdump 简单应用

    在linuxserver上,常常要定位网络问题,就须要用到抓包. 比如:tcpdump -X -s 0 host 10.17.81.22 and port 9999 -w /home/text.cap ...