# 写轮眼图谱：检查与修订记录

日期：2026-11-04  
修订标识：`reference-v2`  
交付文件：[index.html](index.html)

已修正 11 种形态的轮廓、镂空或排布，并保留自动演示、手动尺规、先描线后染色和 SVG 导出。未创建 Git 提交。

## 原因

第一版根据记忆手写了 `tomoe()`、`itachi()`、`obito()`、`sasuke()`、`shisui()`、`madara()`、`izuna()`，用“逗点、三叶、六瓣、圆环”等抽象形状代替了人物的实际轮廓。构图只检查了旋转对称，没有检查母形的头尾方向、正负形、中央孔颜色以及连接方式。

此前的验证主要证明页面、动画、暂停和导出能够运行，没有把完成图与固定参考逐项比较。动画和静态图虽然共用数据，也会一起忠实复现错误数据。这是本次偏差未被及时发现的流程原因。

### 勾玉方向的具体证据

旧版母形的圆头中心为 `(0, -58)`，尾尖为 `(31, -28)`，尾尖到瞳孔的距离约为 `41.8`，小于圆头中心的 `58`，因此尾尖明显向瞳孔内收。

参考母形在原始 300×300 坐标中，圆头中心为 `(60, 150)`，尾尖为 `(18.8, 133.3)`，相对于瞳孔 `(150, 150)` 的距离分别为 `90` 和约 `132.3`。尾尖朝外侧撇出，并保留切向偏移。整体旋转不会改变这两个距离的大小关系，所以仅调整旋转角度无法修复旧版母形。

此外，旧版辅助定位半径使用 `0.58R`，与参考的 `90/145 ≈ 0.621R` 不符。校订后同步调整定位圆，并通过 60° 方向的二等分取得 30° 定位方向。

## 逐项检查结果

| 形态 | 旧版偏差 | 已做修正 |
|---|---|---|
| 单勾玉 | 尾尖内收；圆头、尾部比例及朝向未校准 | 重建向外撇尾的圆头与圆弧，并对齐参考排布 |
| 双勾玉 | 复制了错误母形；两个位置的绝对排布不符 | 使用校订母形，保留相对 180° 的排布 |
| 三勾玉 | 三次复制了错误头尾关系；缺少参考中的连接圆 | 修正母形、120° 排布及低透明度连接圆 |
| 鼬 | 叶刃过渡及尖端曲率失真；中央错误填黑 | 重建三叶长短弧过渡，中央留红孔 |
| 带土／卡卡西 | 外刃过于折线化；缺少外侧细长连接弯钩；中央多出黑点 | 重建尖叶和连接弯钩，中央保留红色圆孔 |
| 佐助 | 错画成六瓣实心花；交错细线与外围黑区缺失 | 重建三条交错闭合细线、六个外围黑区和黑色瞳点 |
| 止水 | 错画成近似正交四角星；偏斜轮廓与红环比例不符 | 重建四枚偏斜弧刃，校正红环与中央黑点 |
| 斑 | 三枚空心勾玉误画成中央大圆环和三个实心圆头 | 重建三枚红孔圆头、外侧长尾及独立黑色瞳点 |
| 泉奈 | 实心圆盘误画成圆环加三条内向辐条 | 重建实心圆盘、三枚向外伸出的矩形端部及红孔 |
| 佐助永恒 | 直接覆盖鼬的完整图案，破坏交错细线和内部区域；中央颜色不符 | 单独重建融合后的三枚内叶，保留交错细线，中央留红 |
| 斑永恒 | 在错误大圆环上添加内向辐条，新增端部方向和位置不符 | 保留空心勾玉长尾，添加相反方向的外伸矩形端部 |

![11 种形态修订前后对照](sharingan-comparison.png)

## 修正方法

1. 固定一组有明确人物名称的参考轮廓，将中心归一化为 `O=(0,0)`，参考虹膜半径 `145` 对应页面 `R=100`。
2. 保留参考中的圆、直线、旋转复制关系、填充与描边、红色镂空和图层顺序。
3. 将参考中的自由曲线分段拟合为真正的圆弧。HTML 内只保存圆、直线和 `A rx ry` 圆弧，且每段 `rx=ry`，没有嵌入参考图片、椭圆或贝塞尔曲线路径。
4. 将原来错误的各人物函数改为读取统一的校订几何数据。大图、索引缩略图、尺规笔画和 SVG 导出均从同一数据生成。
5. 为描边型结构保留 `fill=none`、线宽和透明度。佐助的交错细线参与描线，不进入填黑步骤。红孔依照层级回填。
6. 更新页面中与旧错误形状相对应的文字说明，并在页脚显示“轮廓校订 v2”和本记录链接。

分段圆弧拟合在半径 `R=100` 的尺度下，采样径向误差最大约 `0.287`。这只是拟合采样误差，不能当作官方轮廓精度或完整的全局误差界。

## 验证与回归检查

新增项目检查文件：`tests/geometry-regression.js`。它在浏览器中将各形态和固定参考分别绘制到 300×300 画布，比较黑色区域的交并比（IoU）。排除参考外圈不同描边厚度的影响，阈值为 `0.95`。参考夹具内嵌在检查文件中，运行时无需联网。

已在保留的旧版副本上运行同一组轮廓比较：返回 `pass=false`，11 项全部未通过。校订后返回 `pass=true`，11 项全部通过。

| 形态 | 旧版 IoU | 校订后 IoU |
|---|---:|---:|
| 单勾玉 | 0.3335 | 0.9784 |
| 双勾玉 | 0.2387 | 0.9792 |
| 三勾玉 | 0.1968 | 0.9816 |
| 鼬 | 0.4163 | 0.9905 |
| 带土／卡卡西 | 0.4124 | 0.9902 |
| 佐助 | 0.0674 | 0.9879 |
| 止水 | 0.5527 | 0.9939 |
| 斑 | 0.1427 | 0.9867 |
| 泉奈 | 0.3516 | 0.9976 |
| 佐助永恒 | 0.1446 | 0.9881 |
| 斑永恒 | 0.1329 | 0.9904 |

另外完成：

- 检查全部 11 种形态的作图计划：描线结束后才出现染色命令，染色后不再插入描线，描边型结构不被填黑。
- 实际播放较复杂的“佐助永恒”完整 118 笔动画，完成后正常显示，未发现 JavaScript 运行错误。
- 检查实际浏览器渲染中的大图与 11 项缩略图，核对中央红孔、空心圆头和交错细线。
- 实测 375px 手机布局：拖画完整外圆、沿直尺连线、拖画校订后的局部圆弧，均进入下一笔，未出现 JavaScript 运行错误。
- 实测 320px 宽度无横向溢出；暂停后进度保持不变；SVG 文件成功下载。
- 同时改善手机操作：进入手动笔画时将绘图区滚回可见范围，并在图内提示当前笔画方向与圆规开度。

## 参考与限制

本次采用 Wikimedia Commons 的人物图形作为可重复核对的基准。这些图是社群整理的矢量图，不是官方发布的精确几何尺寸表。漫画、动画中的画面透视、转角、线宽及不同作画版本仍可能有差异。修订结果是对所列参考的尺规几何近似。

来源：

- [普通单勾玉](https://commons.wikimedia.org/wiki/File:Sharingan_simple.svg)、[双勾玉](https://commons.wikimedia.org/wiki/File:Sharingan_double.svg)、[三勾玉](https://commons.wikimedia.org/wiki/File:Sharingan_triple.svg)
- [鼬](https://commons.wikimedia.org/wiki/File:Mangekyou_Sharingan_Itachi.svg)、[带土／卡卡西](https://commons.wikimedia.org/wiki/File:Mangekyou_Sharingan_Kakashi.svg)、[佐助](https://commons.wikimedia.org/wiki/File:Mangekyou_Sharingan_Sasuke.svg)
- [止水](https://commons.wikimedia.org/wiki/File:Mangekyou_Sharingan_Shisui.svg)、[斑](https://commons.wikimedia.org/wiki/File:Mangekyou_Sharingan_Madara.svg)、[泉奈](https://commons.wikimedia.org/wiki/File:Mangekyou_Sharingan_Izuna.svg)
- [佐助永恒](https://commons.wikimedia.org/wiki/File:Mangekyou_Sharingan_Sasuke_(Eternal).svg)、[斑永恒](https://commons.wikimedia.org/wiki/File:Mangekyou_Sharingan_Madara_(Eternal).svg)

参考作者：ShounenSuki、Sannita、Ju gatsu mikka。采用 [CC BY-SA 3.0](https://creativecommons.org/licenses/by-sa/3.0/)；本次几何改绘保留署名和相同许可，并注明了自由曲线转圆弧、配色调整等改动。

## 默认朝向补充修订（reference-v2.1）

原因：参考轮廓本身已按参考图朝向导入，但 `state.rotation` 是跨形态共用的状态；旧版切换形态和开始作图时没有复位，导致上一形态的手动旋转角度继续生效。

修正：

- 初次打开、切换形态和重新开始作图，均使用参考图朝向。
- 同步复位旋转状态、滑块和角度读数，避免画面与控件不一致。
- 新增“参考朝向”按钮，手动旋转后可一键复位。
- 缩略图与导出继续使用同一几何数据；导出保留用户当前选择的旋转角度。

验证结果：将旋转滑块先改为 73°，逐一点击 11 种形态，状态、滑块、读数和 SVG 均复位为参考朝向；85° 下开始作图也正确复位。“参考朝向”按钮可正常复位，320px 布局无横向溢出，11 项参考图轮廓对照继续通过，未出现 JavaScript 运行错误。

## 借鉴 Claude 版本的教学交互（reference-v2.2）

修改前已保存并校验完整备份：`backups/2026-11-04-before-claude-merge-v2.1/`，包含 v2.1 HTML、修订记录、前后对照图和当时的检查文件。备份 SHA-256 校验再次通过。用户提供的 Claude 源文件保持原样。

实际阅读并运行了用户提供的 `wanwu-chigui/sharingan/index.html`。最值得吸收的是以下三点，已结合当前页面实现：

1. **可读、可回看的作图目录。** 增加按当前笔画高亮的完整操作目录，合并连续的同类笔画；点击可以停在对应笔画之前。画布下方提供从头、上一笔、播放／暂停、下一笔，支持左右方向键和空格。保留五个阶段的概览，并用阶段名称替换单独的数字。
2. **有重点的作图辅助信息。** 已完成的辅助线淡化，当前作图线与 A/B 起止点、C 圆心、O 原点突出显示，标签增加纸色描边以提高可读性。完成后收起辅助线，勾选可以恢复查看。
3. **落笔前先移工具。** 连续使用同一种工具时，圆规先移针脚和调整开口，直尺先平移、旋转对齐端点，再开始留墨线；同类重复操作继续加速。工具移位期间不新增墨线。

这些改动使用当前页面的代码和已校准几何数据重新实现。沿用纸面、朱红和墨黑的视觉体系；人物轮廓、默认朝向、手动约束和先描线后染色的顺序继续使用现有实现。

验证：新增 `tests/lesson-regression.js`，14 项检查全部通过，覆盖单笔播放与停下、移工具期间不落笔、回退、目录跳转、活动点标注、历史辅助线淡化、手动圆规、320px 布局、完整 118 笔播放、工具坐标有限性、完成后回看、参考朝向和无运行错误。另实测左右方向键和空格均正常。桌面与手机实际渲染已检查，11 项参考轮廓回归比较继续全部通过。

## 圆规实体化与项目同步（reference-v2.3）

按要求，修改前另存 v2.2 完整备份，并保存目标项目原来的 Claude 页面：`backups/2026-11-04-before-compass-v2.2/`。

旧圆规主要由两根细线和一个圆点构成，针脚与铅笔腿缺少形状差异，开口也显得过于扁平。新版将工具改为可辨认的金属双腿、钢针、红色铅笔夹、木质笔尖、铰链、手柄和调节螺杆，并以图例区分固定针脚与描线笔尖。圆心、描线轨迹、移位时序和手动约束保持原有几何数据。

用户已授权覆盖 `wanwu-chigui/sharingan/index.html`。同步包括 HTML 以及它引用的本修订记录和对照图，不修改项目的 README.md、FEATURES.md，也不创建提交或发布。

圆规实体化后的验证：14 项教学交互检查继续全部通过，桌面实绘中的钢针、铅笔夹、铰链和调节螺杆已目视检查，未出现无效工具坐标。