Diagram Design：有证据的视觉解释
阅读 Diagram Design 源码：矩形检查器能发现什么，又会漏掉什么
通过固定版本的 16 项案例，理解绘制顺序、遮罩阈值，以及正则启发式与浏览器布局的差别。
你将学会
- 跟随矩形进入检查流程
- 同时观察应失败和应通过的案例
- 理解解析器的边界
开始前需要
- 了解 HTML 与 SVG 基础
- 区分系统关系与视觉布局
选择有用的表达方式，说明简化理由，并在实际覆盖范围内解释检查结果。
先看结论
- 源码顺序是碰撞报告条件的一部分。
- 形状阈值与属性语法限制检查覆盖范围。
- 零发现不等于浏览器可见性认证。
跟随矩形进入检查流程
Python 验证器读取 HTML 文件，通过正则表达式提取矩形。它将至少 60×40 的矩形识别为节点，将宽 20—200、高 8—14 的矩形识别为标签遮罩。每个矩形同时记录坐标与源码偏移，因此无需启动浏览器，也能按文档顺序检查绘制关系。
对每个遮罩，只考虑在其后出现的节点。程序计算两个轴上的重叠，忽略不超过一个单位的交叠，并将完全包含在节点中的遮罩视为合法徽章。若遮罩与后绘节点局部相交，就生成一条发现；对该遮罩报告第一个节点后停止继续比较。
同时观察应失败和应通过的案例
隔离实验用未修改的上游命令行脚本检查十六个模拟 HTML 文件。后绘节点遮住部分遮罩时得到一条发现，交换顺序后为零；完全包含的徽章和先绘制的分区也被接受。重叠一个单位被容忍，两个单位则会报告。
宽度边界很重要：宽 200 的遮罩被识别，201 则超出启发式范围；高度 15 的矩形也不再属于遮罩。这些结果说明检查器的分类行为，不能证明被排除的形状在浏览器里一定正确。阈值刻意面向项目预期的模板形状，而不是所有 SVG。
理解解析器的边界
检查的表达式要求 x、y、width、height 按此顺序出现，并使用双引号。案例中，等价但重排属性或使用单引号的矩形未被解析。程序也未应用变换或计算填充透明度：移到远处的遮罩和无填充的后绘节点，仍按原始坐标产生发现。
这些观察说明需要分层验证，而不是绕过检查器或宣称发现漏洞。保持其支持的标记约定，为特殊形状增加针对性测试，再通过实际渲染检查变换、文字宽度和绘制效果。实验仅执行 Python，没有在浏览器运行案例 HTML，也没有执行完整上游测试。
实施步骤
- 1
阅读解析器和分类阈值。
- 2
构造应失败案例及合法对照。
- 3
测试边界值和等价标记写法。
- 4
将检查结果与单独的渲染审阅对照。
可复制示例
{
"已执行上游案例数": 16,
"后绘节点发现数": 1,
"先绘节点发现数": 0,
"宽200发现数": 1,
"宽201发现数": 0,
"重排属性发现数": 0,
"检查器已应用变换": false,
"浏览器可见性已验证": false
}常见问题
零发现意味着标签绝不会被裁切吗？
不是。检查器只覆盖特定矩形启发式和属性约定，文字布局、变换及其他绘制行为仍需检查。
这些结果来自重写的教学模型吗？
不是。我们用固定提交的上游几何命令行脚本原样运行模拟文件；案例与预期结果由本次审阅编写。
资料来源
- scripts/verify-geometry.py来源核查 2026-09-08
- scripts/test-verify-geometry.py来源核查 2026-09-08
- docs/adr/0005-label-geometry-is-verified.md来源核查 2026-09-08