HTML5 canvas 在线画笔绘图工具(一) 功能介绍

这是我用Javascript写的第一个程序，在写的过程中走了很多弯路，所以写完之后想分享出来，给与我一样的初学者做为学习的参考，同时在编写这个程序时我也碰到一些问题，这里我也会一并的提出来给大家讨论，让我们都能得到进步。因为是初学javascript，所以水平较低，欢迎大家提出批评意见。

程序包含以下内容 1、工具条  2、基本的绘图命令，目前仅有 直线、矩形、圆 ，以后有空还会增加一些命令 3、线型选择

4、颜色选择 5、保存图素 6、打开图形。

下面是我儿子的作品，麻烦大家赞一个，谢谢

打开保存图片的效果

在线演示地址

HTML5 canvas 在线画笔绘图工具（一）的更多相关文章

  1. HTML5 canvas 在线画笔绘图工具（三）

    组装画板(TDrawBuilder) 在这一小节中我们要把工具条和画板组装起来,让他们可以协同进行工作. 画板通过一个命名为TDrawBuilder来进行组装.在详细讲解TDrawBuilder对象之 ...

  2. HTML5 canvas 在线画笔绘图工具（二）

    Canvas+Javascript 带图标的工具条制作 TToolbar 工具条是由一个TToolbar对象和两个按钮对象(TImageButton.TColorButton)组成,因为之前我大部分时 ...

  3. HTML5 canvas 在线画笔绘图工具（四）

    HTML5画图命令 图形的绘制是由TDrawHandler与TCommand 协同工作完成. TDrawHandler需要完成以下工作 1.聚集类用于管理绘图的命令 TCommand 2.管理鼠标事件 ...

  4. html5 canvas在线文本第二步设置（字体边框）等我全部写完，我会写在页面底部

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. HTML5 canvas 在线涂鸦

    插件地址 http://bencentra.github.io/jq-signature/ 采用技术 jq-signature.min.js Developed using jQuery 2.1.4. ...

  6. 18个基于 HTML5 Canvas 开发的图表库

    如今,HTML5 可谓如众星捧月一般,受到许多业内巨头的青睐.很多Web开发者也尝试着用 HTML 5 来制作各种各样的富 Web 应用.HTML 5 规范引进了很多新特性,其中之一就是 Canvas ...

  7. 基于HTML5 Canvas和jQuery 的绘图工具的实现

    简单介绍 HTML5 提供了强大的Canvas元素.使用Canvas并结合Javascript 能够实现一些很强大的功能.本文就介绍一下基于HTML5 Canvas 的绘图工具的实现.废话少说,先看成 ...

  8. [js高手之路] html5 canvas系列教程 - arcTo(弧度与二次,三次贝塞尔曲线以及在线工具)

    之前,我写了一个arc函数的用法:[js高手之路] html5 canvas系列教程 - arc绘制曲线图形(曲线,弧线,圆形). arcTo: cxt.arcTo( cx, cy, x2, y2, ...

  9. Processon 一款基于HTML5的在线作图工具

    CSDN的蒋涛不久前在微博上评价说ProcessOn是web版的visio,出于好奇私下对ProcessOn进行了一番研究.最后发现无论是在用户体验上,还是在技术上,ProcessOn都比微软的Vis ...

随机推荐

  1. 根据identifier从StoryBoard中获取对象，UIButton的图片文件位置

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  2. CSU 1119 Collecting Coins

    bfs+dfs 很复杂的搜索题. 因为数据很小,rock最多只有5个,coin最多只有10个,移动rock最多4^5=1024种状态: 思路: 每次先把当前状态能拿到的coin拿走,并将地图当前位置设 ...

  3. 我和小美的撸码日记--基于MVC+Jqgrid的.Net快速开发框架

    前言:以前的帐号没有发首页的权限,特此把这篇文章从另外一个博客移过来,这篇是<我和小美的撸码日记>的序 一转眼务农6年了,呆过大公司也去过小作坊,码农的人生除了抠腚还是抠腚.在所有呆过的公 ...

  4. NET站点Web部署

    NET站点Web部署(一键发布的实现) 在开发过程中经常需要发布到开发环境.测试环境或者预发布环境上给其他同事进行测试验证效果等等,每次发布都要备份,拷贝,修改配置文件等等重复操作非常的麻烦,效率大打 ...

  5. NOD32强制卸载工具使用方法【转】

    装了ESET NOD32又忘记密码了,无法卸载,怎么办? 以下转自官网:http://faq.eset.com.cn/index.php?pid=254 [适用产品:ESET NOD32 防病毒软件4 ...

  6. 火狐的打开3D效果

    最近研究网页的时候,想看看一个页面中盒子的层次问题,点击右键查看元素的后,没有发现3D效果的按钮. 在网上百度后说要什么显卡支持,以为是公司的电脑用的是集显,就没有这个功能.回去用自己的笔记本后,发现 ...

  7. linux里忘记root密码解决办法

    1:打开虚拟机,点‘启动’按钮, 2:出现上面这个界面时,键盘输入’i’,出现grub界面: 3:键盘输入e,出现如下界面: 4:选择第二行(kernel……) 5:键盘输入e,出现如下界面: 6:在 ...

  8. Java BufferedWriter与BufferedReader操作文本文件

    /** * 采用字符流读取写入文本文件 */ public class FileUtil { /** * 写文件 * @param fileName * @param content */ publi ...

  9. poj2975--Nim

    题意:对于一个给定的取石子游戏,有多少种先手策略获胜? Ans:若无法获胜,则输出0. 若能获胜我们只要找到一堆石子,使得我们能取它的一部分让总和的异或和变为0.我们先将整个游戏的值异或起来为s 则a ...

  10. ps2keyboard demo code for 8052

    #pragma code symbols debug objectextend #include <reg51.h> /* special function register declar ...