threejs获得对象的中心

时间:2016-07-11 11:08:38

标签: 3d three.js

我试图检索并绘制某些对象的中心点,但我一直为所有对象获取相同的值,即x = 0,y = 0和z = 0。所以我的中心点始终是场景的中心点。我目前正在阅读3D计算机矩阵,所以我在这方面有点新手。我是否需要以某种方式更新场景或在每个添加的对象之后更新某些矩阵?

function initBoxes(){
    var box = new THREE.Mesh(geometry, material);
    box.position.set(0, 2, 2);
    getCenterPoint(box);

    var box2 = new THREE.Mesh(geometry, material);
    box2.position.set(0, 6, 6);
    getCenterPoint(box2);
}

function getCenterPoint(mesh) {
    var middle = new THREE.Vector3();
    var geometry = mesh.geometry;

    geometry.computeBoundingBox();

    middle.x = (geometry.boundingBox.max.x + geometry.boundingBox.min.x) / 2;
    middle.y = (geometry.boundingBox.max.y + geometry.boundingBox.min.y) / 2;
    middle.z = (geometry.boundingBox.max.z + geometry.boundingBox.min.z) / 2;

    return middle;
}

2 个答案:

答案 0 :(得分:13)

对象boundingBox位于本地空间中。如果您希望中心位于世界空间中,则必须将middle顶点转换为世界空间。您可以使用the THREE.Object3D localToWorld方法轻松完成此操作:

function getCenterPoint(mesh) {
    var middle = new THREE.Vector3();
    var geometry = mesh.geometry;

    geometry.computeBoundingBox();

    middle.x = (geometry.boundingBox.max.x + geometry.boundingBox.min.x) / 2;
    middle.y = (geometry.boundingBox.max.y + geometry.boundingBox.min.y) / 2;
    middle.z = (geometry.boundingBox.max.z + geometry.boundingBox.min.z) / 2;

    mesh.localToWorld( middle );
    return middle;
}

更新

在较新的three.js版本中,THREE.Box3类中有a convenience method getCenter

function getCenterPoint(mesh) {
    var geometry = mesh.geometry;
    geometry.computeBoundingBox();   
    center = geometry.boundingBox.getCenter();
    mesh.localToWorld( center );
    return center;
}

答案 1 :(得分:2)

尝试下面的代码:

let box = new THREE.Box3().setFromObject(myObject3D)
let sphere = box.getBoundingSphere()
let centerPoint = sphere.center

THREE.Box3()。setFromObject(Object3D)将遍历Object3D的几何,并返回它们的整体边界框。