Rectangular Pyramid

I wrote a code to create a rectangular pyramid. There are no errors in console, but no output is shown.
Here is my code:

  <script src=></script>
  <script src="DragControls.js"></script>
  <script src="TrackballControls.js"></script>
var camera,scene,renderer;
function init() {
  // SCENE
  scene = new THREE.Scene();
  camera = new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight,0.1,1000);
  //creating renderer, setting its size and appending it
  renderer=new THREE.WebGLRenderer({antialias:true});
  renderer.setSize(window.innerWidth, window.innerHeight);
  var material = new THREE.MeshStandardMaterial( { color : 0x00cc00 } );
  //Creating Pyramid
  var geometry = new THREE.Geometry();
  //Creating Vectors
      new THREE.Vector3(3,3,3),
      new THREE.Vector3(8,5,2),
      new THREE.Vector3(8,1,2),
      new THREE.Vector3(8,1,4),
      new THREE.Vector3(8,5,4)
      new THREE.Face3(0,1,2),
      new THREE.Face3(0,2,3),
      new THREE.Face3(0,3,4),
      new THREE.Face3(0,1,4),
      new THREE.Face3(1,2,3,4)
  scene.add( new THREE.Mesh( geometry, material ) );
  var render = function () {
    renderer.render(scene, camera);


THREE.Face3(), first three parameters are indices of vertices, the fourth one is normal, which must be THREE.Vector3() and not a number.
You need to build two faces (triangles) for the base of the pyramid.

Take a look at codepen with a pyramid: Sci-fi Scene that I made It’s made of THREE.BufferGeometry() though.

1 Like
new THREE.Face3(1,2,3),

    new THREE.Face3(1,3,4)

I changed it like this,but still no output. :confused:

You’re using THREE.MeshStandardMaterial() and no lights in your scene.
Try to add a light source. Kind of:

  var light = new THREE.DirectionalLight(0xffffff, 0.5);
  scene.add(new THREE.AmbientLight(0xffffff, 0.5));

and moreover, change the position of your camera.

Hey! Yeah, I forgot adding lights to the scene!!! Thankyou Prisoner for letting us come out of the prison…!! :smiley:

1 Like