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. lnmp安装fileinfo扩展

    1.错误: PHP Fileinfo extension must be installed/enabled to use Intervention Image. 2.原因: 缺少 fileinfo扩 ...

  2. debian系统下安装ssh服务

    它是什么?? SSH 为 Secure Shell 的缩写,简单地说,SSH 为建立在应用层基础上的安全协议.SSH 是目前较可靠,专为远程登录会话和其他网络服务提供安全性的协议.利用 SSH 协议可 ...

  3. BZOJ 2599 Race(树分治)

    题目链接:http://61.187.179.132/JudgeOnline/problem.php?id=2599 题意:给一棵树,每条边有权.求一条路径,权值和等于K,且边的数量最小. 题意:每次 ...

  4. Thread详解

    具体可参考:Java并发编程:Thread类的使用,这里对线程状态的转换及主要函数做一下补充. 一.线程状态转换图 注意: 阻塞状态是线程阻塞在synchronized代码块时的状态,而阻塞在Lock ...

  5. CString 的一些事

    MFC Visual Studio 2008 CString 的 Format 中不能这样存在str.Format(_T("Cool(\%)"));  或者 str.Format( ...

  6. 【HDU2795】Billboard(线段树)

    大意:给一个h*w的格子,然后给出多个1*w的板子往格子里面填,如果有空间尽量往上一行填满,输出行数,无法填补,则输出-1: 可以使用线段树转化问题,将每一排的格子数目放到每一个叶子节点上,然后每有一 ...

  7. OpenStack术语名词及问题调试

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAnoAAAEkCAIAAAA3pAtBAAAgAElEQVR4nOy953tUx7o9uCrt2EmtHB

  8. Hibernaate事务管理

    Hibernate使用session时需要继承HibernateDaoSupport对象 HibernateDaoSupport对象中包含默认的getSession()方法,但不可以通过该方法直接启动 ...

  9. C语言获取系统当前时间转化成时间字符串

    因为保存的文件须要加上保存的时间,所以须要一个函数来将系统当前时间获取出来,同一时候转换成时间字符串.详细的时间代码例如以下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 ...

  10. [转]Laravel 4之路由

    Laravel 4之路由 http://dingjiannan.com/2013/laravel-routing/ Laravel 4路由是一种支持RESTful的路由体系, 基于symfony2的R ...