JavaScript Canvas库 fabricjs介绍和安装 作者：马育民 • 2024-09-16 21:20 • 阅读：10024 # 介绍 fabric.js 是一个用于创建可交互式的 HTML5 canvas 应用程序的开源 JavaScript 库，它提供了一套简单、易用的 API，可以快速地实现各种图形操作和动画效果。使用 fabric.js，你可以轻松地创建文本、图像、形状、路径等多种元素，并对它们进行缩放、旋转、位移、剪切、合并等操作。 ### 案例 [图片编辑器](https://segmentfault.com/a/1190000042631716 "图片编辑器") [MG动画在线制作](https://www.malaoshi.top/donghua "MG动画在线制作") ### 官网 http://fabricjs.com/ https://fabricjs.github.io/ ### 教程 https://geek-docs.com/fabricjs/fabricjs-tutorials/t_how-to-add-blur-in-and-blur-out-animation-to-a-polyline-using-fabricjs.html https://blog.csdn.net/qq_40340943/article/details/125144861 https://segmentfault.com/a/1190000042022539 ### 特点： - 简单易用：fabric.js 的 API 非常简单、易于理解和使用，即使是初学者也能够快速上手。 - 功能强大：fabric.js 提供了各种基本图形元素的创建和操作方法，同时还支持高级功能，如复合对象、滤镜、选区、事件处理、动画等。 - 跨浏览器兼容：fabric.js 支持多种主流浏览器，包括 Chrome、Firefox、Safari、Edge 和 IE 等。 - 开源免费：fabric.js 是完全开源的，你可以自由地使用、修改和分发它。 # 安装 ### 版本选择 `5.x` 版本是用 JavaScript 开发的 `6.x` 版本以后是用 typescript 开发的（集成vue时，导入模块的方式就不痛） 目前互联网资料主要是 `5.x` 之前的写法，所以本系列文章使用 `5.x` 版本 ### CDN ``` <script src="https://unpkg.com/fabric@5.4.0/dist/fabric.min.js"></script> ``` ### vue安装 ``` npm i fabric@5.4.0 --save ``` 参考： https://blog.csdn.net/weixin_41712594/article/details/135058444 原文出处：http://malaoshi.top/show_1IX8RGtUYi9M.html