SVG.js 一个轻量且强大的图形库
在前端开发中,当你需要生成、操作或动画化 SVG 矢量图时,很多人会直接写原生 SVG 标签或者用 Canvas。然而,直接操作 SVG 的 XML 结构不仅繁琐,还容易出错。
这时候,SVG.js 就是一个轻量且强大的帮手。
🎨 什么是 SVG.js?
SVG.js 是一个专门用于操作 SVG 的 JavaScript 库,目标是让 SVG 的创建、变换、动画、交互变得更简单、直观。
它最大的特点是:
✅ API 简洁、链式调用友好
✅ 文件体积小(压缩后不到 20KB)
✅ 拓展性强,有丰富的插件体系
✅ 不需要依赖第三方框架,纯原生 JavaScript
🧩 核心功能
下面列举一些 SVG.js 的核心能力,让你快速感受一下:
1️⃣ 快速创建 SVG 元素
import { SVG } from '@svgdotjs/svg.js'const draw = SVG().addTo