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. Android studio快捷键Mac版本

    为了方便大家记住这些小技巧和快捷键,我把它写成了一个插件,欢迎大家下载使用:http://chunsheng.me/EasyShortcut/ 快捷键 描述 通用------------------- ...

  2. python学习第三天 --布尔类型

    我们已经了解了Python支持布尔类型的数据,布尔类型只有True和False两种值,但是布尔类型有以下几种运算: 与运算:只有两个布尔值都为 True 时,计算结果才为 True. True and ...

  3. 《Programming WPF》翻译 第5章 2.内嵌样式

    原文:<Programming WPF>翻译 第5章 2.内嵌样式 每一个“可样式化”的WPF元素都有一个Style属性,可以在内部设置这个属性--使用XAML属性-元素的语法(在第一章讨 ...

  4. cocos2d-x特效之CCControlPotentiometer

    在test示例下面,有一个关于此功能的代码,实现的效果如下: 通过拉动可旋转的按钮,从而改变所代表的值,这个效果的确是很棒的,但,和我的需求有一些差别,先贴上我实现的效果吧               ...

  5. ZOJ3829---模拟，贪心

    这是2014年ACM亚洲区预赛牡丹江现场赛的一道题,铜牌题,可惜当时一路WA到死... 只有乘法的后缀表达式的特点有两个:(1)数字的数量一定大于‘*’的数量(2)最后一位一定是‘*’: 数字比*多的 ...

  6. C++默认构造函数的一点说明

    大多数C++书籍都说在我们没有自己定义构造函数的时候,编译器会自动生成默认构造函数.其实这句话我一直也是 深信不疑.但是最近看了一些资料让我有了一点新的认识. 其实我觉得大多数C++书籍之所以这样描述 ...

  7. C++按值和按址传递对象的思考和优化

    C++是一门面向对象(OOP)编程语言,在这门语言中也有函数,函数的参数可以是变量数值,当然也可以是对象.所以,传统地就有关于对象是按值传递还是按址传递的讨论. 在C语言中,按值传递在很多情况下可以出 ...

  8. javascript 我是广告

    <!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equ ...

  9. fcitx-rime添加五笔/五笔拼音

    简介 Rime,全名:中州韵输入法引擎,它不仅仅是一个输入法,也是一个输入法算法框架.Rime 支持拼音.双拼.注音.五笔和仓颉等音码.形码输入法. 安装 Debian sid 用户可以使用下面命令安 ...

  10. ARC 工作原理

    自动引用计数(Automatic Reference Counting),是一个编译期间工作的能够帮你管理内存的技术. ARC在编译期间为每个Objective-C指针变量添加合适的retain, r ...