Scene graph

The family tree of a 3D scene: move a parent object and all of its child parts follow.

the tree of objects in a 3D sceneobjects inside other objectsparent child objectsgrouping parts of a modelmake the wheels move with the carwhy do the wheels not follow the car when I move itmoving the parent moves everythingscene grapgh

See it

Live demo coming soon

What it is

A scene graph is the tree that holds a 3D scene together. Every node can have children and a local transform, so moving a parent moves the whole branch beneath it. A car node can own four wheel nodes; rotate one wheel locally and it spins in place, move the car and every wheel comes along.

Reach for the hierarchy when an object is made from parts, needs a pivot, or should move as one assembly. In three.js, Scene, Group, Mesh, Camera, and Light all inherit from Object3D, so the same parent-child rules apply across the scene. Parenting in Blender with Ctrl+P builds the same tree, and glTF preserves that node structure on export, which is why clean naming and sensible pivots in the modeling tool pay off in code.

Gotcha: transforms accumulate down the tree. A scale of 0.5 on a parent also halves every child, and reparenting with add() changes the child's world transform because its local numbers now use a different parent. Use Object3D.attach() when reparenting should preserve the visible world transform, and avoid non-uniformly scaled parents when attach() is part of the plan.

Ask AI for it

Build this assembly as a three.js scene graph using Object3D and Group. Create a car root, body child, and four wheel children with each wheel pivot centered on its axle; move and steer the car at the root while spinning each wheel in local space. Use Object3D.attach() for any runtime reparenting that must preserve world position.

You might have meant

transforms coordinate spacesrigging skinning skeletal animationgltf glbfrustum cullingorbit controls