最近重新在看Html5&CSS3的知识，看到canvas的时候，想到了以前在学校学计算机图形学时做过的画图实验，于是想，可以基于html5和css3来做一款画板，经过1天的努力，完成了画板的一些简单的功能，发出来和大家进行分享一下。

这个画板的功能十分的简单，只是实现了随意画，基于橡皮筋的直线、圆、矩形、三角形的画法以及橡皮擦等，线条有数十种宽度和数十条颜色，而且能够下载完成的图画。

截图如下：

最后附上源码：https://github.com/Mafurion/Painter

基于canvas的画板的更多相关文章

  1. 一款基于HTML5 Canvas的画板涂鸦动画

    今天给各网友分享一款基于HTML5 Canvas的画板涂鸦动画.记得之前我们分享过一款HTML5 Canvas画板工具,可以切换不同的笔刷,功能十分强大.本文今天要再来分享一款基于HTML5 Canv ...

  2. 7个华丽的基于Canvas的HTML5动画

    说起HTML5,可能让你印象更深的是其基于Canvas的动画特效,虽然Canvas在HTML5中的应用并不全都是动画制作,但其动画效果确实让人震惊.本文收集了7个最让人难忘的HTML5 Canvas动 ...

  3. 微信小程序-基于canvas画画涂鸦

    代码地址如下:http://www.demodashi.com/demo/14461.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  4. Particles.js基于Canvas画布创建粒子原子颗粒效果

    文章目录 使用方法 自定义参数 相关链接 Particles.js是一款基于HTML5 Canvas画布的轻量级粒子动画插件,可以设置粒子的形状.旋转.分布.颜色等属性,还可以动态添加粒子,效果非常炫 ...

  5. 基于canvas的二维码邀请函生成插件

    去年是最忙碌的一年,实在没时间写博客了,看着互联网行业中一个又一个人的倒下,奉劝大家,健康要放在首位,保重身体.好了,言归正传,这是17年的第一篇博文,话说这天又是产品同学跑过来问我说:hi,lenn ...

  6. canvas实现画板

    canvas实现画板 主要用到知识点: 鼠标事件onmousedown() onmousemove() onmouseup() onmouseleave() 事件委托 canvas的一些方法 如:绘制 ...

  7. 基于canvas的仪表盘效果

    概述 基于Canvas实现的仪表盘及效果.通过配置参数,可以任意修改仪表盘颜色,刻度,动画过渡时间等,满足不同场景下的使用.同时使用原生的Canvas,也是学习Canvas的很好的例子. 详细 代码下 ...

  8. 基于canvas实现钟表

    原理说明 1.通过arc方法实现钟表外环: 2.通过line实现钟表时针,分针,秒针和刻度标志的绘制,基于save和restore方法旋转画布绘制不同角度的指针: 3.通过font方法实现在画布上绘制 ...

  9. 基于canvas二次贝塞尔曲线绘制鲜花

    canvas中二次贝塞尔曲线参数说明: cp1x:控制点1横坐标 cp1y:控制点1纵坐标 x: 结束点1横坐标 y:结束点1纵坐标 cp2x:控制点2横坐标 cp2y:控制点2纵坐标 z:结束点2横 ...

随机推荐

  1. MySQL----DML（增删改表中数据）

    ##DML:增删改表中的数据 1.添加数据 *语法: *  insert into 表名(列名1,列名2,...列名n) values (值1,值2,...值n); *注意: 1.列名和值要一一对应. ...

  2. win 7 系统过期处理办法

    超级尴尬,刚装的win7 系统居然过期了.下次再也不装盗版了,吼吼吼 处理方法就是下载oem7F7 软件安装,不用再怎么操作就好了. 就是这么简单,并不用像网上那样找什么激活码.

  3. 维护你的请求队列，处理token异常

    前言 网络请求是开发中最基础也是最核心的需求,封装一个稳定且可用性高的请求也显得尤为重要.通常封装的内容除了入参之外,更多的是请求中的异常处理.本文分享下我在处理 token 异常方面的做法,通过维护 ...

  4. Api接口幂等设计

    1,Api接口幂等设计,也就是要保证数据的唯一性,不允许有重复. 例如:rpc 远程调用,因为网络延迟,出现了调用了2次的情况. 表单连续点击,出现了重复提交. 接口暴露之后,会被模拟请求工具(Jem ...

  5. 《Mathematical Analysis of Algorithms》中有关“选择第t大的数”的算法分析

    开头废话 这个问题是Donald.E.Knuth在他发表的论文Mathematical Analysis of Algorithms中提到的,这里对他的算法分析过程给出了更详细的解释. 问题描述: 给 ...

  6. IBN-Net: 提升模型的域自适应性

    本文解读内容是IBN-Net, 笔者最初是在很多行人重识别的库中频繁遇到比如ResNet-ibn这样的模型,所以产生了阅读并研究这篇文章的兴趣,文章全称是: <Two at Once: Enha ...

  7. ScrollViewer - 可用鼠标拖动滚动的列表框

    ScrollViewer添加附加属性: using System; using System.Collections.Generic; using System.Windows; using Syst ...

  8. 徒手生撸一个验证框架，API 参数校验不再怕！

    你们之中大概率早已练就了代码的拷贝.粘贴,无敌的码农神功,其实做久了业务功能开发,练就这两个无敌神功,那是迟早的事儿.今天先抛一个小问题,来打通你的任督二脉,就是很好奇的问一下:业务功能开发中,输入参 ...

  9. node.js模拟学校教务处登录

    临近毕业,在做毕设,我的毕设中有一个功能是模拟我学校的教务处登录以获得cookie,本来以为是挺简单的一个功能,但却花了我两天的时间.(我学校教务处用的是湖南强智科技开发的) 在网上搜了大量的模拟登录 ...

  10. 分治与递归-Fibonacci数列兔子问题

    裴波那契(Fibonacci leonardo,约1170-1250)是意大利著名数学家.在他的著作<算盘书>中许多有趣的问题,最富成功的问题是著名的“兔子繁殖问题”: 如果每对兔子每月繁 ...