8

When I use Blender to model an object, I am able to explicitly define its center position from which translations and rotations occur. When working with Three.js objects, I don't seem to find an equivalent.

Does a Three.js object have a property that defines its "center" position? If not, how is the the center of the object determined?

Kolban
  • 13,794
  • 3
  • 38
  • 60

2 Answers2

10

In three.js, an object's "center" is the origin in the object's local coordinate system.

If your object is not rotating around the point you want, then you need to translate the vertices of your geometry so the desired center is at the origin.

geometry.translate( distX, distY, distZ );

See this answer for more information and an alternate solution.

three.js r.78

Community
  • 1
  • 1
WestLangley
  • 102,557
  • 10
  • 276
  • 276
3

The center can be determined by the geometry's boundingBox, which will be computed by calling computeBoundingBox() method;

If the local coordinate system's origin is not the center of the geometry, call center() method will adjust the geometry to center it at the origin.

see three.js source code

pink li
  • 102
  • 6
  • I guess this might be the most recent source code for that API: https://github.com/mrdoob/three.js/blob/de7c36a30773aa7941c46516af71e6993a7640ea/src/core/BufferGeometry.js#L261 – Megidd Jan 21 '23 at 09:15