title: Best way to make a BufferGeometry contour in Three.js
body: <p>I'd like to make a specific <strong>contour</strong> in my <strong>BufferGeometry</strong>.  The goal is make a fill polygon and the lines around.</p>
  
  <p>Now, I try using MultiMaterialObject, but the line <strong>crosses</strong> the square: <a href="http://jsfiddle.net/VsWb9/3918/" rel="nofollow">http://jsfiddle.net/VsWb9/3918/</a></p>
  
  <pre><code>    var positionArray = [0,0,0, 0,100,0, 100,100,0, 
                           0,0,0, 100,100,0 ,100,0,0],
          colorArray = [];
  
      for(var i = positionArray.length;i--;)
          colorArray[i]=1 // white    
  
  
      bufferGeo.addAttribute('position', new THREE.BufferAttribute(new Float32Array(positionArray), 3));
      bufferGeo.addAttribute('color', new THREE.BufferAttribute(new Float32Array(colorArray), 3));
  
      materialsArray = [
      new THREE.LineBasicMaterial({vertexColors: THREE.VertexColors, side: THREE.DoubleSide}),
      new THREE.MeshBasicMaterial({color: 0xff0000, wireframe: true, opacity: 0.2, transparent: true, shadding: THREE.SmoothShading})
          ];
      mesh = THREE.SceneUtils.createMultiMaterialObject(bufferGeo, materialsArray);
  </code></pre>
  
  <p>But I don't need the cross line. In this example, I use the square, but in my project there are thousands polygons (Pentagon,Hexagon, etc).
  What is the best way to do the perfect contour, without the cross line?</p>
  
  <ul>
  <li>Make two separate "BufferGeometry" ? ( One using LineBasicMaterial with different sequence of vertices positions and other using MeshBasicMaterial with the actual sequence )</li>
  <li>Other?</li>
  </ul>
  
  <p>Thanks</p>