Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

307
Views
Có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 ingrese la descripción de la imagen aquí

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) }
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

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.

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!