0
303
VistasCómo obtener el ancho y la altura visibles de un objeto de malla ThreeJS en unidades de píxeles
Me enfrento al desafío de averiguar el ancho y la altura de la vista visible de un objeto de malla ThreeJS en unidades de píxeles.
En la captura de pantalla a continuación, puede ver objetos flotando en el espacio 3D, al hacer clic con el mouse, necesito poder averiguar qué ancho y alto de vista ocupan en píxeles 
Como soy bastante nuevo en ThreeJS, me está tomando bastante tiempo encontrar una solución, por lo que agradecería cualquier tipo de ayuda.
La siguiente función muestra qué tipo de enfoques he estado probando.
getObjectSizeInViewSpace(object){ const size = new THREE.Vector3() const box = new THREE.Box3().setFromObject(object).getSize(size) size.project(this.camera) let halfWidth = window.innerWidth / 2; let halfHeight = window.innerHeight / 2; size.x = (size.x*halfWidth) size.y = (size.y*halfHeight) return new THREE.Vector2(size.x,size.y) }1 Respuestas
Responde la pregunta0
Estás buscando Vector3.project() . Esto básicamente toma coordenadas del espacio mundial (3D) y usa la ventana de la cámara para convertirlas en coordenadas de dispositivo normalizadas, que van desde [-1, 1] . Por ejemplo x: -1 es el lado izquierdo de la pantalla y x: 1 es el lado derecho. Así que tendrás que tomar los 4 vectores (arriba a la izquierda, arriba a la derecha, abajo a la izquierda, abajo a la derecha) de tu avión para calcular sus dimensiones en píxeles en tu navegador:
// Get 3D positions of top left corner (assuming they're not rotated) vec3 topLeft = new Vector3( plane.position.x - planeWidth / 2, plane.position.y - planeHeight / 2, plane.positon.z ); // This converts x, y, z to the [-1, 1] range topLeft.project(camera); // This converts from [-1, 1] to [0, windowWidth] const topLeftX = (1 + topLeft.x) / 2 * window.innerWidth; const topLeftY = (1 - topLeft.y) / 2 * window.innerHeight; Observe que el valor de topLeftY está invertido, ya que -y en el espacio 3D se convierte en +y en las coordenadas de píxeles. Haz esto 4 veces (una para cada esquina), y luego puedes restar (derecha - izquierda) para obtener el ancho, y lo mismo para la altura.