作者本人的干货，一般人我不给他看。（开玩笑的） canvas是一个很实用的工具，难可以难到头发掉光，简单可以简单到几行代码就能给人眼前一亮的效果。这里是作者在开发canvas的道路上遇过的坑，以及如何用简易地使用canvas做一些日常任务，比如分享图片的自定义，又比如大家喜欢的…

最近在用PlayCanvas制作公司产品的3D模型，记录一下相关的知识。 PlayCanvas就是一个基于WebGL的游戏引擎，结合了物理、光影、音效等工具用于创建一个复杂的界面。

一、前言 在观看本文之前推荐先看看这位朋友的文章(使用canvas实现贝塞尔曲线波浪特效)，本文是在此基础上收到启发然后进行的变化，当然，观看与否不会影响接下来的阅读体验。 二、实现思路 其实整个波浪

😡 fabric.js 为我们提供了很多厉害的方法。今天要搞明白的一个东西是 canvas.interactive

关于Fabric的事情是一切都是基于对象的，大多数事情也是基于向量的。 与原生画布不同，我们不能仅仅删除全局位图上的一些像素。我们在下面有整个对象模型，canvas输出是所有在canvas上呈现的那些

Fabric.js 半自动化标注。 为了方便演示，我在初始化画布的时： 1. 添加一个背景图，该背景图的尺寸和初始化的画布一样大。 2. 默认渲染一个矩形。 3. 右侧可以放大缩小画布以及删除

🎈 使用 fabric.js 创建的图形，默认的缩放原点是元素操作点的对角点。如果想将默认缩放操作设置为“中心缩放”，只需将 centeredScaling 属性设置为 true 即可。

🎴 fabric.js 的前景图可以从视觉上覆盖画布中其他元素。前景图的使用方式和前景色差不多，但要考虑的情况会比前景色多一丢丢~

🦄 fabric.js 的铅笔其实是继承基础画笔的一个工具，在基础画笔的基础上多了“拐角平滑度”等配置项。 本文讲解铅笔的基础用法以及常用事件。