Obtention de la boîte englobante ou des centres de modèles

Question

Je me demandais s'il existait un moyen d'obtenir la boîte englobante pour les modèles insérés via 3dio.js, ou de calculer autrement leurs points centraux? Je cherche à les centrer sur l'origine.

Les images ci-dessous montrent deux modèles relatifs à l'origine de la scène indiquée par la boîte rouge.

Answer 1

Vous pouvez accéder à l'objet Three.js de l'entité 3d.io comme ceci:

var threeElem = document.getElementById("custom-id").components['io3d-data3d'].data3dView.threeParent 

Ensuite, vous pouvez utiliser la boîte englobante natif de Three.js :

var bbox = new THREE.Box3().setFromObject(threeElem) 

Comme cela vous obtenez les limites min/max qui ch vous pouvez utiliser pour déterminer l'origine.

J'espère que cela répond à votre question. Faites le moi savoir!

Edit: pour les meubles, il serait probablement

var threeElem = document.getElementById("custom-id").components['io3d-furniture'].data3dView.threeParent 

Answer 2

Sur la base de la réponse de Madlaina. Je devais assurer que le modèle a été chargé avant

addModelToScene(type) { 

    let scene = document.querySelector('a-scene'); 
    let model = document.createElement('a-entity'); 
    model.setAttribute('io3d-data3d', getModelKey(type))  

    model.addEventListener('model-loaded',() => { 
     // Access the three.js object of the 3d.io 
     let threeElem = model.components['io3d-data3d'].data3dView.threeParent 

     // create the bounding box 
     let bbox = new THREE.Box3().setFromObject(threeElem) 

     // Calculate the center-point offsets from the max and min points 
     const offsetX = (bbox.max.x + bbox.min.x)/2 
     const offsetY = (bbox.max.y + bbox.min.y)/2 
     const offsetZ = (bbox.max.z + bbox.min.z)/2 

     // apply the offset 
     model.setAttribute('position', {x:-offsetX,y:-offsetY, z:-offsetZ}) 
    }); 

    scene.appendChild(model);  

} 

Le résultat: