Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the "center" of a Three.js object?

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?

like image 750
Kolban Avatar asked Jun 25 '16 16:06

Kolban


2 Answers

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

like image 122
WestLangley Avatar answered Sep 22 '22 05:09

WestLangley


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

like image 38
pink li Avatar answered Sep 21 '22 05:09

pink li