Skip to content


 Zabbix
 Grafana
 Prometheus
 React Three Fiber
 Threejs and TypeScript
 SocketIO and TypeScript
 Blender Topological Earth
 Sweet Home 3D
 Design Patterns Python
 Design Patterns TypeScript
   
 Course Coupon Codes
Three.js and TypeScript
Kindle Edition
$6.99 $9.99 Paperback 
$22.99 $29.99




Design Patterns in TypeScript
Kindle Edition
$6.99 $9.99 Paperback
$11.99 $19.99




Design Patterns in Python
Kindle Edition
$6.99 $9.99 Paperback
$11.99 $19.99




Object3D Hierarchy

Description

The scene is an Object3D. You can add other Object3Ds to the scene, and they become children of the scene. The scene itself is derived from the Object3D base class.

If you rotate the scene, or scale the scene, or translate its position, it will affect all if its child objects.

You can make an Object3D a child of another Object3D by nesting the components. E.g.,

<mesh>
  <icosahedronGeometry />
  <meshNormalMaterial wireframe />
  <mesh>
    <boxGeometry />
    <meshNormalMaterial wireframe />
    <mesh>
      <sphereGeometry />
      <meshNormalMaterial wireframe />
    </mesh>
  </mesh>
</mesh>

You can also add more than one Object3D to any other Object3D that already exists in the scene. Any changes to any Object3D transforms such as position, scale, rotation will affect all the children under that same parent equally.

scene
    |--object1 (Red Ball)
        |--object2 (Green Ball)
            |--object3 (Blue Ball)

In this example, the green ball is a child of the blue ball, which is a child of the red ball.

Any changes to the red ball will affect the green and blue balls,

Any changes to the blue ball, will affect the green ball, but not its parent, the red ball.

Furthermore, any changes to the green ball, have no effect on its parent, or grandparent balls.

Working Example