SuperAPI AI 工具集

preview-threejs

设计与创作

查看项目

更新于 10-16 06:15

技能介绍

用途:preview-threejs 是一个 Three.js 交互式 3D 可视化查看器,用于创建 3D 可视化、渲染几何图形与图案、可视化 3D 数据、构建交互式 3D 场景以及原型化 3D 动画。它预配置了场景、相机、光照和轨道控制,你只需编写 Three.js 代码。

主要能力:基于 WebGL 的 3D 渲染;轨道控制(拖动旋转、滚动缩放、右键拖动平移);预配置环境光与方向光;通过 scene.userData.customAnimate 实现每帧动画;重置视图按钮;代码查看器切换;响应式设计。相机为位于 (0, 0, 5) 的 PerspectiveCamera,渲染器为启用抗锯齿的 WebGLRenderer。

使用方式:将 Three.js 代码通过管道传给脚本,或传入文件。命令示例:cat scene.js | ./run.sh;./run.sh model.threejs;/preview-threejs solar-system.threejs;cat visualization.js | /preview-threejs。脚本会自动处理 HTML 生成并在浏览器打开,请勿手动打开以避免重复标签页。支持 -o/--output 指定输出路径,--no-browser 跳过浏览器仅输出文件路径。代码可使用预置变量 THREE(r160)、scene、camera、renderer,创建几何体与材质、网格并加入场景,可选定义 scene.userData.customAnimate。

适用场景:临时或生成的 3D 场景建议用管道而非创建临时文件,以免文件系统杂乱且内容会自动清理。

限制:文件扩展名为 .threejs 或 .3d,最大 10MB(可配置),需为有效且自包含的 JavaScript 代码,无外部依赖;需要支持 WebGL 的现代浏览器并启用 JavaScript,依赖 Three.js r160 CDN;生成独立 HTML 文件于 .preview-skills/threejs/{filename}.html。其他收费、价格或平台信息暂未提供。