前言： 在公司的一个病理图像标注的过程中，需要实现超过 2G 大小的图像的加载，以及标注功能。以下代码均使用 React Hook 书写，如有其他框架需求，也可进行参考。 主要技术： Fabric.j

在Fabric.js中自由绘制矩形就是想象中那么简单。重点是用好“mouse:down”和“mouse:up”

利用fabric.js库实现对图片进行批注的需求，主要可以添加矩形、箭头、自由画笔等操作，且canvas支持缩放。

Fabric.js是一款强大的HTML5画布库，它能够让我们轻松地在网页上创建、编辑和操纵各种图形元素。无论你是想制作一个炫酷的图形编辑器，还是实现动态的图形效果，Fabric.js都能满足你的需求。

最近由于公司业务需要，原本使用第三方的互动白板功能，准备自行实现。一方面为了节省开支，另一方面自行实现定制化也更强一些，能够和现有业务更好的结合，用以满足第三方互动白板无法实现的一些功能。

使用 canvas 开发的项目，滚轮缩放画布的需求应该不算少数，比如地图。 Fabric.js 也提供了缩放画布的功能，本文主要讲解设置画布大小的几种方法。

在 Fabric.js 里要全文设置统一文字颜色非常简单，但如果要设置某个字符的颜色，官方文档的说明可能会有点绕。本文会展开讲解单行和多行文本应该如何设置指定字符颜色和背景色