npx skills add ...
npx skills add full-stack-skills/threejs-skills --skill threejs-math
three.js math library: Vector2/3/4, Matrix3/4, Quaternion, Euler, Color, Box2/Box3, Sphere, Plane, Ray, Line3, Triangle, Frustum, Cylindrical/Spherical coords, MathUtils, and Interpolant base classes; addon math utilities such as OBB, Octree, Capsule, ConvexHull, MeshSurfaceSampler. Use for transforms, intersection tests, and spatial queries; for keyframe interpolation tied to AnimationMixer use threejs-animation; for picking implementation use threejs-objects with Raycaster.
npx skills add full-stack-skills/threejs-skills --skill threejs-math
ALWAYS use this skill when the user mentions:
applyQuaternion, lookAt, world vs local transformsBox3/Sphere, containment/intersection testsRay vs Plane vs Frustum tests (without full picking pipeline)IMPORTANT: math vs objects vs animation
| Need | Skill |
|---|---|
| Raw math types | threejs-math |
Raycaster + layers picking | threejs-objects |
| QuaternionKeyframeTrack playback | threejs-animation |
Trigger phrases include:
updateMatrixWorld before world-space queries (threejs-objects).Box3().setFromObject(object) for rough bounds; refine per need.ray.intersectBox, sphere.containsPoint, etc., per docs.Octree/OBB for games—cite addon pages, avoid copying full API tables here.Color conversions relate to materials/textures—cross-link.MeshSurfaceSampler for distributing points on meshes.See examples/workflow-ray-aabb.md.
| Docs section | Representative links |
|---|---|
| Math | https://threejs.org/docs/Vector3.html |
| Math | https://threejs.org/docs/Matrix4.html |
| Math | https://threejs.org/docs/Quaternion.html |
| Math | https://threejs.org/docs/Ray.html |
Core math types are listed under Math; addon utilities (Octree, OBB, …) appear under Addons → Math in three.js docs. Global also lists constants (e.g. wrapping, blending) sometimes needed alongside materials.
When answering under this skill, prefer responses that:
Vector3, Matrix4, Quaternion, …) from the docs.AnimationMixer / track math to threejs-animation when time-sampled.Raycaster picking flows to threejs-objects when interaction is the goal.English: vector, matrix, quaternion, euler, box3, sphere, ray, frustum, three.js
中文: 向量、矩阵、四元数、欧拉角、包围盒、射线、three.js