three.js 编辑器的 AI 执行引擎

three.js 编辑器的 AI 执行引擎

本文围绕three.js 编辑器（一款基于 Three.js 的 AI 驱动可视化低代码编辑器）展开。

- 🌐 在线预览： https://z2586300277.github.io/threejs-editor/

- 📦 GitHub 开源仓库： https://github.com/z2586300277/three-editor

- 📚 文档地址： https://z2586300277.github.io/three-editor/docs/dist

AI 助手不是简单地把用户输入发给大模型，再把返回的文本显示出来。three.js 编辑器内部有一套 AI 执行引擎，负责把自然语言转化为对编辑器的安全调用。

意图识别

当用户说“把场景里的立方体变红”时，AI 首先需要理解意图：修改对象属性。然后它会调用getSceneStats或inspectScene获取上下文，确认场景中是否存在立方体。

动作编排

AI 执行引擎维护了一张动作表，对应EDITOR_ACTIONS中定义的能力，例如addCoreLight、setObjectParams、animateMeshTransform等。每个动作都有参数说明和执行条件，AI 会根据需求选择合适动作。

安全护栏

为了防止 AI 误操作，引擎会对参数进行校验：数值范围、颜色格式、对象 ID 是否有效等。只有校验通过才会真正执行，失败时返回错误提示而不是破坏场景。

多轮上下文

历史会话会被保存，AI 能参考之前的对话继续修改。例如用户先让 AI 添加一个光柱，再说“把它变高一点”，AI 会知道“它”指的是刚才的光柱。

代码一瞥

await runEditorAction(editor, {
action: 'setProps', params: { id: meshId, color: '#ff0000', position: [2, 0, 0] } })