Crear un plano en Three.js

- 👤 Andrés Cruz

🇺🇸 In english

Crear un plano en Three.js

Al igual que la esfera en Three.js que generamos anteriormente, lo importante es notar que solamente cambia el nombre de la figura geométrica; en este caso, la del plano que viene siendo la de PlaneGeometry que recibe como parámetro el ancho y largo del plano

const geometryPlane= new THREE.PlaneGeometry(14, 5)

Por lo demás, hay que definir el material y a agregarlo a la escena:

// plano
const geometryPlane= new THREE.PlaneGeometry(14, 5)
const materialPlane= new THREE.MeshBasicMaterial({ color: 0xFF0000, wireframe: false })
const plane= new THREE.Mesh( geometryPlane, materialPlane)
scene.add(plane)

Ya con el plano agregado, puedes variar sus transformaciones geométricas, por ejemplo:

//*** POSICIONES
cube.position.x = -5
cube.rotation.x = Math.PI * .5
plane.rotation.x = Math.PI * -0.5
plane.position.set(0,-2,1)

Recuerda que cuento con un curso introductorio a Three.js para dar los primeros pasos.

Acepto recibir anuncios de interes sobre este Blog.

Veremos como generar la figura geométrica de un plano en Three.js.

| 👤 Andrés Cruz

🇺🇸 In english