简介
首先要说的是:本文篇幅很
Fabric.js 简介
Fabric.js
是一个功能强大且操作简单的Javascript HTML5 canvas
工具库。
如果你需要用 canvas
做特效,那我推荐你使用 Fabric.js
,因为 Fabric.js
语法更加简单易用,而且还提供了很多交互类的 api
。
Fabric.js
简化了很多 Canvas
里的概念,代码看上去也更加语义化。
Fabric.js
能做什么?
可以打开 『Fabric.js 官网首页』 直接看例子,也可以看看 『Fabric.js Demos』 查看更炫酷的例子。
本文简介
如果是 0基础 的读者,希望可以从头读到尾,读完起码大概知道 Fabric.js
有哪些功能。
本文是根据我学习过程来编写的,只要跟着本文一步一步操作,一定可以入门 Fabric.js
,同时还能改善您的睡眠质量、解决毛发过多等诸多问题。
由于我使用 Fabric.js
的时间不长,这份笔记在各个知识点的内容肯定不够全面的,也不一定完全正确。读者们如果发现本文存在不正确的地方请大胆指出,我会改的~
本文适合人群:
- 有原生三件套基础的开发者
- 最好有
canvas
基础(这是加分项,完全没有也没关系的)
本文主要讲解 Fabric.js
基础,包括:
- 画布的基本操作
- 基础图形绘制方法(矩形、圆形、三角形、椭圆、多边形、线段等)
- 图片和滤镜的使用
- 文本和文本框
- 动画
- 分组和打散分组
- 基础事件
- 自由绘画
- 裁剪
- 序列化和反序列化
- ……
除此之外,还会讲一些进阶一点的操作,比如:
- 自定义操作角样式和状态
- 自定义控件
- 复制粘贴图形
- 使用事件方式操作图形和分组
- ……
除了上述内容外,我还会根据日后的工作中整理出更多常用和好玩的操作,本文即学习仓库会不定期更新!!!
相关链接
『Fabric.js npm地址』
『Fabric.js github地址』