SuperAPI AI 工具集

threejs-builder

设计与创作

查看项目

更新于 10-16 05:02

技能介绍

用途:threejs-builder 是 Codex-ready 框架,用于以现代 ES 模块方式构建优雅、高效的 Three.js(r150+)网页体验,如 hero 区块、交互式产品查看器、粒子背景、GLTF 展示或快速原型。

主要能力:以场景图为核心组织层级与变换;提供 GLTF 加载、缓存、克隆与 SkeletonUtils 参考;强调先锁定“参考框架契约”(轴向、锚点、单位、颜色空间),并提供 60 秒校准场景与可视化前向箭头验证;包含游戏模式(状态机、动画切换、视差、对象池)、后处理、着色器、物理、实例化等参考主题;提供 GLTF 校准辅助脚本安装。

使用方式:从 three 包或 CDN(>=0.150)以 ES 模块导入,不使用全局 THREE;交互时接入 OrbitControls 并启用阻尼、每帧 update;GLTF 需经本地服务器加载,动画/蒙皮克隆用 SkeletonUtils.clone(),加载后记录动画剪辑名并按精确字符串选择;动画用 renderer.setAnimationLoop,状态存于循环外;校准辅助脚本安装命令:python3 .agents/skills/threejs-builder/scripts/install-gltf-calibration-helpers.py --out ./gltf-calibration-helpers.mjs,或进入技能目录运行 python3 scripts/install-gltf-calibration-helpers.py --out ./gltf-calibration-helpers.mjs,使用 attachGltfCalibrationHelpers(...)。

适用场景:作品集 hero、游戏原型、数据可视化、背景循环等,按用途选用不同材质、灯光与动画。

限制:资料未提供定价、平台兼容性细节或效果保证;避免在循环内创建几何体/材质,像素比建议上限 2,需按资产包逐一验证前向与锚点,勿假设 GLTF 朝向。