为什么使用 canvas 库

原生 canvas 的操作主要基于上下文，需要使用者自己从0开始去实现一些基本功能，比较复杂 （如：根据分辨率设置清晰度，否则会模糊等）。而 canvas 库文件则封装好了许多便利的对象，使得用户可以在比较高级的层面上进行绘制。

Fabric.js

http://fabricjs.com/

优点：

• 比较老牌，常用的转换（放大、缩小、拖拽）都已经封装好了，特别适合用 Canvas 写 交互性 的界面，如：编辑文字等
• 内置了丰富的笔刷，基本的对齐、标线都有了
• 代码集成度比较高，内置了可交互富文本（纯 Canvas 实现）
• 互联网资料多

缺点：

• 代码使用 ES 5开发，不能很好的支持 TypeScript，开发效率可能会有影响
• 由于库本身集成了很多功能点，代码包的大小偏大（压缩后308 kB）
• 细节功能还需要完善，比如标线系统实现相对简单

Konva.js

https://konvajs.org/

优点：

• 支持桌面/移动端事件
• 控制点的自定义样式和事件可以轻松实现
• 使用 TypeScript 编写，TS 原生支持
• 渲染分层比较清晰，Stage -> Layer -> Group -> Shape
• 代码简洁、干净，易于阅读
• 核心代码精七，代码包较小（压缩后155 kB）

缺点：

• 部分功能实现基于 DOM（富文本）
• 后起之秀，周边生态还比较薄弱

原文链接：https://blog.csdn.net/qq_31851435/article/details/131479373

原文出处：/show_1IX8PYgKCVzQ.html