AI 协作日志

学号：202412211401029 · 来源：ai-log.md

# 实验三 AI协作记录

学号：202412211401029　姓名：韦丰华

## AI协作1 · 矩阵乘法次序
### 我的目标与初步判断
Task B 要区分"绕世界原点转"和"绕对象自己中心转"。我先自己推了一遍：正方形中心 C=(0.50,0.25)，写 Rz(45°)·T(C) 的话按列向量"右边先作用"，是先把正方形搬到 C、再连位置一起绕原点转 45°，中心应该跑到 (0.18,0.53) 附近；写 T(C)·Rz(45°) 的话中心应该还留在 (0.50,0.25)。推是这么推，但我不确定乘法方向有没有记反。

### 关键提示词（原文）
> 列向量下 M=R·T 是右边先算，我想确认：正方形中心在 C=(0.5,0.25)，Rz(90°)·T(C) 和 T(C)·Rz(90°) 各自把正方形变到哪？绕世界原点公转该用哪个？

### AI关键建议摘要
AI 确认我的推法没错：公转用 R·T(C)，原地自转用 T(C)·R；缩放要"绕自己中心"同理写 T(C)·S。还提醒别拿截图猜旋转正负，直接看页面下方的矩阵数值和"矩阵数值检验"，gl-matrix 是列主序，数组第 13、14 个元素才是平移量。

### 我的测试方法与结果
先看页面自带的矩阵数值检验，五行全 ✓：平移 (1.30,-0.20,0.00,1.00)、缩放 (2.00,0.00,0.00,1.00)、Z轴+90° (0.00,1.00,0.00,1.00)、Y轴+90° (0.00,0.00,-1.00,1.00)、平移作用于 w=0 的向量 (1.00,0.00,0.00,0.00)。最后一行让我真正把"点 w=1、方向 w=0"弄明白：方向向量过完平移矩阵一个数都没变。再把模型切正方形、角度 45°：选"世界原点"时正方形明显离开 (0.50,0.25) 跑到别处，换"对象中心"就停在原地转，和手算一致。做 Task C 时顺手又核了一次：正方形在 0.65 秒时 Model 矩阵位移读数是 (0.3060,0.5382)，手算 45°×0.65≈29.26° 把它的初始中心 (0.53,0.32) 绕原点转过去也是 (0.3061,0.5382)，对得上。

### 采纳情况及修正结论
采纳 R·T(C) 公转、T(C)·R 自转。我之前以为公转是"把平移量直接加到旋转结果上"，那其实是先转后平、画出来是自转，这次用矩阵数值纠正过来了。

## AI协作2 · 动画调试
### 具体错误现象（人为注入）
Task C 要求三角形沿 X 轴在 ±0.30 内往复。写对之后为了亲眼看看"漂移"长什么样，我把位移临时改成线性写法 d=amplitude*(t/period)，准备测完就改回去。

### 我的初步排查
盯着截图看（间隔 4 秒连截三张）根本看不出它跑走。我先怀疑浏览器缓存了旧代码，去查了服务器实际返回的 js，确认是新代码，排除缓存。那就剩两种可能：动画跑得太慢，或者我的观察方式不对。

### 关键提示词（原文）
> 我把三角形往复平移临时写成了 d=amplitude*(t/period)，想验证漂移，但盯着截图看不出来它在漂；这是为什么？怎么才能确定它漂没漂？

### AI建议与逐项测试
AI 给了三个候选：① 不活跃窗口的 rAF 会被浏览器节流，而我又把 dt 限到 0.1 秒，动画时间推进得比真实时间慢很多，漂移速度被压得肉眼难辨；② 截图间隔短、靠眼睛估位置不准；③ 公式其实没生效。它建议别靠眼睛，直接读对象的 Model 矩阵和 elapsed。
我逐项测：① 读 elapsed，真实过了 5 秒动画时间只推进 0.9 秒，确实被节流了（顺带说明 dt 上限 0.1 在起作用，没有跳跃）；② 读矩阵位移分量，三次是 -0.5350 → -0.4450 → -0.3650，一直朝一个方向涨，这就是漂移；③ 手算 -0.60+0.1×t 代入这三个时刻得 -0.535/-0.445/-0.365，全部吻合，确认就是这一行的问题。

### 最终原因及修复证据
原因是位移没用周期函数包住、随时间线性增长。改回 amplitude·sin(2πt/period) 后连读 5 次位移：-0.430/-0.667/-0.815/-0.632/-0.464，全在 [-0.90,-0.30]（中心 -0.60、幅度 0.30）内，而且是先往外走再收回来，不再单调；把这些时刻代入手算基本就是这几个数。Console 没报错。这次记住：漂没漂看截图不靠谱，得读数值再和手算对。

## AI协作3 · 截图方案
### 待解决的问题
Task E 要把 WebGL 画布存成 PNG，我怕两个坑：存出来是空白或纯黑；像素尺寸和画布内部尺寸对不上。

### 两个方案的AI提示词（原文）
> canvas.toBlob 保存 WebGL 画布，一种说法是开着 preserveDrawingBuffer:true 直接 toBlob 就行，另一种说截图前必须先重绘一次。哪种对？各自代价是什么？

### 方案比较、取舍理由
方案一：只靠 preserveDrawingBuffer:true，一行 toBlob 完事，代码最少；但它完全依赖"建上下文时开了这个标志"这个前提，换环境或者参数被关掉就会静默出黑图，也不好跟人解释。方案二：截图事件里先 this.draw() 重画一帧再 toBlob，多花几毫秒，但不依赖那个标志，逻辑说得通。我最后两个都用：保留标志不动、保存前再主动重绘一次，算双保险；回调里还加了 Blob 为空就提示失败的判断，不静默下载。

### 实际实现、测试与结果
文件名用时间戳拼成"实验3_画布_年月日_时分秒.png"。实测：960×540 画布、加 6 个对象后点保存，提示"已保存PNG截图（960×540像素）"。下载下来的文件我打开核了：尺寸 960×540，和画布内部像素一致；整张图 5 种颜色，背景色占 51 万多个像素、圆形那个蓝色有两千来个像素，不是空白也不是纯黑。截图只含 Canvas 像素、不含右侧面板，符合要求。

## 其他AI使用（若有）
做每道题之前我基本都先让它帮我把题目过一遍，搞清楚"这题要交什么、从哪下手"，然后自己写代码。五次大概记一下：

- Task A（四种几何模型）：问的是这题改哪里。思路是 A-01 在绘制循环里，四种形状在 geometry.js 里都存成三角面了，直接按 mesh.vertexCount 全画出来，不用按类型区分；A-02 是菜单分支，选"全部"按预设位置放四个、选单个就放画布中心。改完菜单切换正常，四面体能看出是几个不同颜色的面拼出来的立体。

- Task B（矩阵与次序）：见上面协作1。

- Task C（动画规律）：问的是动画怎么组织、坑在哪。思路是位置和缩放都用"初始中心+周期函数"算，别逐帧往当前坐标上累加；缩放写 T(C)·S；rAF 只开一次，dt 用时间戳算并加上限，暂停时只更新 lastMs、不累加动画时间。实测圆形倍数一直在 1~2 之间（读到 1.47×/1.80×/1.27×），暂停 2 秒两次读数一模一样（1.83×/0.191），继续后是 1.43×/-0.044 没有突跳，速度拉到 0 就完全冻住。排错过程见上面协作2。

- Task D（鼠标添加对象）：问的是点击怎么变成图形。思路是 u、v 先拿 clientX 减画布 rect.left 再除以 rect.width，x=(2u-1)×宽高比、y=1-2v（Y 方向要翻）；面板参数在点击那一刻读成数值快照存进对象，之后改菜单只影响之后添加的。实测点画布中心得 (-0.071,0.053)、点水平 25% 垂直 25% 处得 (-0.702,0.526)，和预期的 (0,0)、(-0.667,+0.5) 基本一致（差的那点是我鼠标没点在正中间）；连点之后 7 个对象共存，公转的、自转的、斜向的各走各的。

- Task E（完整画布）：问的是画布设置和清屏要注意什么。思路是 resize 要同时更新 canvas 宽高、viewport 和正交投影；清屏只清 objects 数组，不销毁 WebGL 上下文、不停 rAF。实测改 960×540 后原对象一个没丢（提示"已保留 3 个对象"）、圆还是正圆没被拉扁，清屏后计数归 0、还能再正常添加。截图方案见上面协作3。