AI 协作日志

学生 Web 实验作品平台

学号:202312215301009 · 来源:ai-log.md

# 实验三 AI协作与核验记录

> 代码补全由 ChatGPT(GPT-6)协助。以下区分了已完成的代码级数值核验与需要本人在浏览器中完成的现场核验;不得把尚未做的浏览器操作写成已完成。

## 协作1:矩阵和变换次序

- 我的目标:补齐平移、缩放、旋转矩阵,并让矩阵乘法次序符合列向量约定。
- AI工具:ChatGPT(GPT-6)。
- 关键提示词/任务原文:依据《实验三》Task B,补全 `js/transforms.js` 中的缩放矩阵 `S`、X/Y/Z轴旋转矩阵 `R`,完成矩阵探针测试;补全 `js/app.js` 中平移、缩放和世界原点/自身中心旋转。
- AI建议:使用 `M.fromScaling`、`M.fromXRotation/fromYRotation/fromZRotation`;列向量下 `R·T` 先平移再旋转,`T·R` 先旋转再平移。
- 代码级核验:使用Node.js加载项目自带 `common/gl-matrix.js` 和变换模块执行 `probe()`。得到平移约 `(1.3,-0.2,0,1)`、缩放 `(2,0,0,1)`、Z轴旋转约 `(0,1,0,1)`、Y轴旋转约 `(0,0,-1,1)`,方向向量经平移后仍为 `(1,0,0,0)`。
- 本人浏览器操作与截图证据:![File](file.png)。
- 结论:数值探针与指导书预期一致;仍需在浏览器中观察两个旋转中心的轨迹差异。

## 协作2:动画与对象状态

- 错误/待解决现象:学生版动画时间固定为0,圆不缩放、三角形不往返。
- AI工具:ChatGPT(GPT-6)。
- 关键提示词/任务原文:依据《实验三》Task C/D,补全requestAnimationFrame时间增量、各对象elapsed更新、三角波、往复位移和对象创建时参数快照。
- AI建议:用时间戳差值计算秒级dt并限制单帧最大dt;暂停期间不推进elapsed;每个对象保存初始中心、运动方向、幅度、速度和elapsed;位置由初始中心与时间函数计算,不逐帧累加。
- 代码修改:已在 `js/transforms.js` 实现三角波、方向往复平移、周期缩放和旋转Model矩阵;在 `js/app.js` 实现单一rAF循环和对象参数快照。
- 实际浏览器测试结果、Console信息及修复前后截图:![File2](file2.png)![File3](file3.png)。
- 结论:代码逻辑已补全;需现场确认暂停恢复、多个对象独立运动和鼠标位置。

## 协作3:方案比较与实现核验

- 待解决的设计问题:多对象场景如何组织状态,以及截图如何确保得到当前WebGL画面。
- AI工具:ChatGPT(GPT-6)。
- 关键提示词/任务原文:依据《实验三》Task D/E,比较每帧重建顶点与复用GPU Buffer、对象状态数组与单一对象、直接导出Canvas与先重绘再toBlob的方案。
- 方案比较:
  1. 每帧重新上传顶点数据:实现直观,但重复占用CPU/GPU传输;本实验采用局部顶点Buffer一次创建、每帧只更新Model矩阵Uniform。
  2. 只保存一个当前对象与使用 `objects` 数组:前者会覆盖旧对象;采用数组保存每个对象的独立状态。
  3. 不主动重绘直接截图与先调用 `draw()` 再 `toBlob()`:后者更明确地确保导出当前帧;同时启用 `preserveDrawingBuffer`。
- 实际实现:已补齐清屏、画布尺寸/背景更新及PNG导出逻辑。
- 浏览器实际下载并打开PNG、检查尺寸及六对象验收情境:![File4](file4.png)。
- 结论:实现选择优先复用资源和保持对象状态独立;提交前必须完成浏览器端核验。