获得渲染上下文和它的绘画功能。比如说用来定义画笔样式以及进行绘画的所有操作。getContext()只有一个参数 x与y指定了在canvas画布上所绘制的矩形的左上角（相对于原点）的坐标。width和height设置矩形的尺寸。 绘制一条从当前位置到指定x以及y位置的直线。 开…

Canvas是一个可以使用脚本（通常为Javascript，其它比如 Java Applets or JavaFX/JavaFX Script）来绘制图形，默认大小为300像素×150像素的HTML元素。 经过了以上地狱般的学习，我相信同学们现在已精通canvas。 接下来，我…

其次，我开通了我的个人主页，里面有自己的技术文章，还会有个人的随想、思考和日志。以后所有的文章都会第一时间更新到这里，然后同步到其他平台。有喜欢的朋友可以没事去逛逛，再次感谢大家的支持！ 定义一个<canvas> </canvas> 画布。 定义一个<canvas> </can…

总所周知canvas绘制的图形没有交互功能，这篇文章是我这两天基于canvas绘制地铁图总结出来了。

相信很多同学都用过 canvas，其操作简单而言就是擦除和绘制，当 canvas 动效越来越复杂的时候，我们时常会担心一帧中的计算超过 16ms，因为此时给用户看到的效果就会明显卡顿。对此我们写了一篇关于 canvas 的「最佳实践」，希望对你有所启发：《Canvas 最佳实践（性能篇）》 ——淘宝 FED

Canvas是 HTML5 新增的，一个可以使用脚本(通常为JavaScript)在其中绘制图像的 HTML 元素。它可以用来制作照片集或者制作简单(也不是那么简单)的动画，甚至可以进行实时视频处理和渲染。 Canvas是由HTML代码配合高度和宽度属性而定义出的可绘制区域。J…

1. 粒子系统的共性 1. 创建 canvas 画布。 2. 初始化粒子（创建粒子形状，确定粒子的起始位置）。 3. 绘制粒子到画布。 4. 定义粒子的运动方式（即粒子的运动动画）。 5. 控制动画的播放与暂停。 6. 清除画布。 1. 创建 canvas 画布。 （基类完成）…

双十一光棍节又要来临了，每年这个时候都是本人最苦闷的时刻。日渐消瘦的钱包，愈发干涸的双手，虽然变强了，头却变凉了。今年一定要搞点事情！ 最近听女神说想谈恋爱了，✧(≖ ◡ ≖) 嘿嘿，一定不能放过这个机会，给她来个不一样的表白。 作为整天搞可视化的前端攻城狮，最先想到的就是常玩…

canvas用于在网页上绘制图像、动画，可以将其理解为画布，在这个画布上构建想要的效果。 canvas可以绘制动态效果，除了常用的规则动画之外，还可以采用粒子的概念来实现较复杂的动效，本文分别采用普通动效与粒子特效实现了一个简单的时钟。 普通动效即利用canvas的api，实现…