Octahedron

by vander2000

HTML

<script src="//cdn.rawgit.com/mrdoob/three.js/master/build/three.min.js"></script>

CSS

body {
	  margin: 0;
}

JavaScript

init();
      animate();

      function init() {
        camera = new THREE.PerspectiveCamera(30, window.innerWidth / window.innerHeight, 0.1, 1000);
        camera.position.set(0, 0, 20);

        scene = new THREE.Scene();

        var geometry = new THREE.OctahedronGeometry(1,0 )
        var color = new THREE.Color( "#7833aa" );
        var color2 = new THREE.Color( "#cccccc" );
        var material1 = new THREE.MeshLambertMaterial( {color: color.getHex()} );
        var material2 = new THREE.MeshLambertMaterial( {color: color2.getHex()} );
        var cubeA = new THREE.Mesh( geometry, material1 );
        cubeA.position.set( 0, 0, 0 );

        var cubeB = new THREE.Mesh( geometry, material2 );
        cubeB.position.set( 1, 1, 1 );

        //create a group and add the two cubes
        //These cubes can now be rotated / scaled etc as a group
        var group = new THREE.Group();
        group.add( cubeA );
        group.add( cubeB );

        scene.add( group );

        // so many lights
          var light = new THREE.DirectionalLight( 0xffffff, 1 );
          light.position.set( 0, 1, 0 );
          scene.add( light );

          var light = new THREE.DirectionalLight( 0xffffff, 0.5 );
          light.position.set( 0, -1, 0 );
          scene.add( light );

          var light = new THREE.DirectionalLight( 0xffffff, 1 );
          light.position.set( 1, 0, 0 );
          scene.add( light );

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

          var light = new THREE.DirectionalLight( 0xffffff, 1 );
          light.position.set( 0, 0, -1 );
          scene.add( light );

          var light = new THREE.DirectionalLight( 0xffffff, 0.5 );
          light.position.set( -1, 0, 0 );
          scene.add( light );



        renderer = new THREE.WebGLRenderer({
          antialias: true
        });
        renderer.setPixelRatio(window.devicePixelRatio);
       ...