title: Generate mesh faces for vertices in THREE.js
body: <p>I'm not sure if the answer is supposed to be blindingly obvious but it eludes me. I'm doing the 3D Graphics class on Udacity that uses three.js. I'm at a point where I'm required to generate a 3d mesh. </p>
  
  <p>I've got the vertices all generating correctly, but I'm stuck at generating faces for them. I can't think of an obvious way to auto generate faces that don't overlap. I've searched and searched around the web but I can't find any information about it. I'm not sure if it's something stupidly obvious or just not very documented. Here's the code:</p>
  
  <pre><code>function PolygonGeometry(sides) {
      var geo = new THREE.Geometry();
  
      // generate vertices
      for ( var pt = 0 ; pt &lt; sides; pt++ )
      {
          // Add 90 degrees so we start at +Y axis, rotate counterclockwise around
          var angle = (Math.PI/2) + (pt / sides) * 2 * Math.PI;
  
          var x = Math.cos( angle );
          var y = Math.sin( angle );
  
          // YOUR CODE HERE
          //Save the vertex location - fill in the code
          geo.vertices.push( new THREE.Vector3(x, y, 0) );
      }
      // YOUR CODE HERE
      // Write the code to generate minimum number of faces for the polygon.
  
  
      // Return the geometry object
      return geo;
  }
  </code></pre>
  
  <p>I know the basic formula for the minimum number of faces is n-2. But I just can't think of a way to do this without faces overlapping. <strong>I don't want anyone to do my work for me, I want to figure it out myself as much as I can. But is there anyone who can point me in the right direction or give me a formula or something?</strong></p>