title: three.js - How to set camera position?
body: <p>I'm pretty beginner in three.js and webgl programming. so I have created a box in three.js and its working fine but the problem is when I set camera position in z axis(eg: camera.position.z = 2; ) the box just disappears. could anyone explain me why is it happening and how can I properly set the position of the camera?</p>
  
  <p>try uncommenting the <code>camera.position.z = 2;</code> in the <a href="https://jsfiddle.net/03errgLw/2/" rel="noreferrer">fiddle</a></p>
  
  <pre><code>function init() {
  
      var scene = new THREE.Scene();
  
      var box = getBox(1, 1, 1);
  
      scene.add(box);
  
      var camera = new THREE.Camera(45, window.innerWidth/window.innerHeight, 1, 1000 );
      //camera.position.z = 2;
  
      var renderer = new THREE.WebGLRenderer();
  
      renderer.setSize(window.innerWidth, window.innerHeight);
      document.getElementById("webgl").appendChild(renderer.domElement);
  
      renderer.render(scene, camera);
  }
  
  function getBox(w, h, d) {
      var geometry = new THREE.BoxGeometry(w, h, d);
      var material = new THREE.MeshBasicMaterial({
          color : 0x00ff00
      });
  
      var mesh = new THREE.Mesh(geometry, material);
  
      return mesh;
  } 
  
  init();
  </code></pre>