Like the sphere in Three.js that we generated earlier, the important thing to note is that only the name of the geometric shape changes; in this case, the one of the plane that has been the one of PlaneGeometry that receives as a parameter the width and length of the plane
const geometryPlane= new THREE.PlaneGeometry(14, 5)For the rest, you have to define the material and add it to the scene:
// plane
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)Now with the plane added, you can vary its geometric transformations, for example:
//*** POSICIONES
cube.position.x = -5
cube.rotation.x = Math.PI * .5
plane.rotation.x = Math.PI * -0.5
plane.position.set(0,-2,1)Remember that I have a curso introductorio a Three.js para dar los primeros pasos.
Develop with Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter