0

I want to create a tetrahedron that starts off right side up like a pyramid, and eventually will rotate mostly along an x axis kind of like a planet.


import * as THREE from 'three';


// Setup

const scene = new THREE.Scene();

const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);

const renderer = new THREE.WebGLRenderer({
  canvas: document.querySelector('#bg'),
});

renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight);
camera.position.z = 15;





//Torus

const geometry = new THREE.TetrahedronGeometry(6,0);
const material = new THREE.MeshStandardMaterial( { color: 0xFF6347 } );
const torus = new THREE.Mesh( geometry, material );
scene.add( torus );

//light
const light = new THREE.AmbientLight( 0xffffff ); // soft white light
scene.add( light );

function animate() {
    requestAnimationFrame( animate );
  torus.rotation.x += 0.01;
  torus.rotation.y += 0;
  torus.rotation.z += 0;
    renderer.render( scene, camera );
}
animate();

Adjusting the initial camera angle seems like a harder approach, is there a way to load a Tetrahedron initially to be right side up like a pyramid?

EDIT: If using the following way to draw out a tetrahedron

const verticesOfCube = [
  1, 1, 1,  - 1, - 1, 1,    - 1, 1, - 1,    1, - 1, - 1
];

const indicesOfFaces = [
  2, 1, 0,  0, 3, 2,    1, 3, 0,    2, 3, 1
];

const geometry = new THREE.PolyhedronGeometry( verticesOfCube, indicesOfFaces, 1, 0 );

it still initially appears on it's edge instead of 1 face being towards the bottom, right side up pyramid shape

ewakwwg12
  • 71
  • 7

0 Answers0