关于 threejs-geometries
threejs-geometries 是用于构建和修改 three.js 几何体的技能,涵盖内置基元、自定义缓冲数据和形状挤出,并提供工作流与文档指引。
主要功能
- 01BufferGeometry 与属性
- 02基元几何体指引
- 03Shape 与路径挤出
- 04实例化属性指引
- 05几何体释放与常见问题
适用场景
- 01创建自定义网格
- 02挤出二维轮廓
- 03添加几何实例化数据
- 04排查法线或面绕序问题
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ full-stack-skills/ threejs-skills --skill threejs-geometries安装后在 Claude Code 中输入/threejs-geometries确认已加载。
附带文件agents/openai.yamlexamples/workflow-extrude-shape.md
详细介绍
适用场景
用户提到以下内容时,始终使用此技能:
- 构建或修改
BufferGeometry、属性、索引缓冲区、绘制范围 - 通过
InstancedBufferAttribute/InstancedMesh实现实例化(几何体相关内容;网格包装器请使用 threejs-objects) - 沿路径挤出
Shape、TubeGeometry、LatheGeometry、ExtrudeGeometry - 文本或贴花附加几何体
重要:几何体与数学
- threejs-geometries = 可供 GPU 使用的三角形数据。
- threejs-math = 不依赖网格拓扑的
Box3、Sphere、Ray测试。
触发短语包括:
- “BufferGeometry”、“BufferAttribute”、“ExtrudeGeometry”、“Shape”、“Curve”
- “几何体”、“缓冲几何”、“挤出”、“文字几何”
如何使用此技能
- 如果内置基本几何体符合需求,优先使用它们,再考虑自定义缓冲区。
- 对于自定义网格:创建
BufferGeometry,设置position、normal、uv和可选的index;计算包围体以进行剔除。 - 对于实例化属性,使 divisor/count 与 threejs-objects 中的
InstancedMesh模式保持一致。 - 对于 2D 轮廓:构建
Shape/Path,根据文档进行挤出或旋转成形;参阅 Extras Curve 系列文档了解路径采样。 - 对于附加组件 NURBS 节点,请酌情参考 Addons Curves 页面——引用文档,不要复制完整 API。
- 替换网格时,释放几何体以避免内存泄漏。
参见 examples/workflow-extrude-shape.md。
文档索引(官方)
范围
- 涵盖范围: Core 几何体、缓冲区核心、曲线/形状/挤出工作流,以及部分附加组件几何体。
- 不涵盖: 物理碰撞网格烘焙;完整的 CAD 导入流程。
常见问题与最佳实践
- 缺少法线会影响光照;应一致地计算或导入法线。
- 绕序错误会翻转面——检查侧面和剔除设置。
- 属性数量过大时需要使用 LOD 或简化(附加组件中的修改器——仅在用户询问时提及)。
文档与版本
基本几何体和 BufferGeometry 位于 three.js 文档中的 Geometries 和 BufferGeometry 下。曲线、Shape 和挤出 API 位于 Extras 和 Geometries 下;Addons Curves / Geometries 文档介绍了 NURBS 和文本网格;请链接到这些文档,而不要复制冗长的签名。
Agent 回复检查清单
使用此技能回答时,优先采用以下做法:
- 根据需要链接到
BufferGeometry、基本几何体或ExtrudeGeometry/Shape。 - 将实例化用法指向 threejs-objects,以了解
InstancedMesh模式。 - 如果变形由时间驱动,将变形目标和轨道指向 threejs-animation。
- 合并/拆分时,仅通过名称和文档链接提及
BufferGeometryUtils(Addons Utils)。 - 替换大型自定义缓冲区时,强调使用
dispose()。
参考
- https://threejs.org/docs/#Geometries
- https://threejs.org/docs/BufferGeometry.html
- https://threejs.org/docs/ExtrudeGeometry.html
关键词
English: buffergeometry, extrude, shape, path, curve, primitives, instancing, three.js
中文: 几何体、BufferGeometry、挤出、Shape、曲线、实例化、three.js
评论
支持 Markdown