Any way to get a bounding box from a three.js Object3D?

Question

I\'m loading an OBJ file using Three.js and OBJLoader.js. This returns a Three.Object3D object, which has what you\'d expect from a 3D model (position vector, up vector...)

Answer 1

For any shape, on its geometry object, there is a boundingBox property. This property holds a THREE.Box3 object. This Box3 object consists of two THREE.Vector3 objects, min and max.

var geometry = new THREE.CylinderGeometry(...);
var material = new THREE.LineBasicMaterial(...);
var mesh = new THREE.Mesh(geometry, material);

var boundingBox = mesh.geometry.boundingBox.clone();
alert('bounding box coordinates: ' + 
    '(' + boundingBox.min.x + ', ' + boundingBox.min.y + ', ' + boundingBox.min.z + '), ' + 
    '(' + boundingBox.max.x + ', ' + boundingBox.max.y + ', ' + boundingBox.max.z + ')' );

For more complex shapes, like those loaded from JSON Object files, the bounding box property is undefined by default. It must be computed explicitly.

var loader = new THREE.ObjectLoader();
loader.load(imagePath, function(object){

    geometry = object.children[0].children[0].geometry;  // substitute the path to your geometry

    geometry.computeBoundingBox();  // otherwise geometry.boundingBox will be undefined

    var boundingBox = geometry.boundingBox.clone();
    alert('bounding box coordinates: ' + 
        '(' + boundingBox.min.x + ', ' + boundingBox.min.y + ', ' + boundingBox.min.z + '), ' + 
        '(' + boundingBox.max.x + ', ' + boundingBox.max.y + ', ' + boundingBox.max.z + ')' );
}