生产场景
机制章回答「API 是什么」。这一章回答 这类产品的场景图怎么切、哪一层必须是节点、哪一层可以光栅。
每篇默认已经读过：
坐标系一律：世界单位 + 相机（viewBox）。业务几何存在世界里；屏幕只是当前视口。不要用 CSS scale 冒充相机。
文档清单
| 文档 | 场景 |
|---|---|
| 图标系统与 sprite | symbol / use、单文件、currentColor |
| 图表与数据可视化 | 轴与系列、join、密集点光栅 |
| 流程图与节点编辑器 | 节点/边文档、连线不是截图 |
| 矢量白板与无限画布 | 相机、虚拟化、墨迹可光栅 |
| 地图与平面图 | 裁剪、瓦片、热区节点 |
| 插画交互动画 | CSS / WAAPI；用户文件禁用 SMIL |
| 在线矢量编辑器 | 文档模型、手柄、序列化 |
| 打印与 PDF 导出 | 矢量进印刷，禁止先转糊 PNG |
| 进度环与仪表盘 | dasharray、读屏值 |
| 热区与图片标注 | 底图世界坐标 + 矢量框 |
| 撤销重做文档模型 | 文档命令栈，不是像素快照 |
反模式（所有场景共用）
- 把 PNG / canvas 截图当文档存盘。
- 用 CSS
transform: scale放大整棵 SVG DOM 冒充相机。 - 未消毒
innerHTML灌用户 SVG。 - 每个工具自己用
offsetX，不经过getScreenCTM/ 自己的 viewBox 相机。 - UI chrome（菜单、对齐线、远程光标）写进可导出的那棵文档树。
核对日期：2026-08-26