构建教材黑白矢量插图（SVG + LaTeX + 高清 PNG 导出）

这个技能产出什么

一张教材级别的黑白矢量插图，交付为自包含 HTML 文件（双击可在浏览器打开预览），可一键导出高清 PNG。适用于教材、讲义、试卷、课件中需要精确线条 + 数学/物理符号的示意图：几何证明图、受力分析图、光路图、电路图、函数图像、坐标系等。

硬性约束（违反即不合格）

这些约束来自教材插图的本质要求——精确、规范、可印刷。理解了"为什么"，执行时才不会走偏：

1. 黑白矢量风格：仅用 #000（黑）/#fff（白）+ 1–2 级灰度（#555 / #e5e5e5）。不用彩色、渐变、阴影、彩色填充。原因：教材多为黑白印刷，彩色会印成不可控灰阶；矢量才能任意缩放不糊。用线型区分语义：实线=实体边界/已知线，虚线=辅助线/隐藏边，点划线=对称轴，箭头=力/方向。

2. 所有公式、符号、运算符、物理/数学符号必须用 LaTeX 渲染：经 MathJax tex-svg.js 渲染为矢量。禁止用 Unicode 字符凑（½ ² √ θ → ≈ 等）——它们字体不统一、排版不专业、上下标错位。正确写法：$\frac{1}{2}$ $x^2$ $\sqrt{x}$ $\theta$ $\to$ $\approx$。

3. 图形必须用 SVG 绘制：线条、形状、箭头都是 SVG 元素。禁止用 Canvas（位图，缩放必糊）、禁止用位图截图充当矢量。

4. 教学准确性：标注、比例、符号、方向必须符合学科规范（力的箭头从作用点沿方向画出、光路图光线带方向、电路符号标准化）。这是教材插图的命脉——一张画错的受力图会直接误导学生。

工作流程