title: Generate a mesh from points Three.js
body: <p>I'm trying to generate a mesh from points. I've read <a href="https://stackoverflow.com/questions/41847752/generate-mesh-from-points-three-js">here</a> the way to generate the mesh is, </p>
  
  <pre><code>var mesh = new THREE.ConvexGeometry( vertices_array );
  </code></pre>
  
  <p>In <a href="http://threejs.org/examples/webgl_geometry_convex.html" rel="nofollow noreferrer">this example</a> they've declared the <code>vertices_array</code> like below</p>
  
  <pre><code>var vertices = new THREE.DodecahedronGeometry( 10 ).vertices;
  </code></pre>
  
  <p>What I need to understand is, how to define the <code>vertices_array</code> for points created using <code>THREE.BufferGeometry</code> with the code below.</p>
  
  <p>Thank you very much</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
      &lt;head&gt;
          &lt;title&gt;Three.js&lt;/title&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;script src="js/three.js"&gt;&lt;/script&gt;
          &lt;script src="js/TrackballControls.js"&gt;&lt;/script&gt;
          &lt;script src="js/WebGL.js"&gt;&lt;/script&gt;
          &lt;script src="js/ConvexGeometry.js"&gt;&lt;/script&gt;
          &lt;script src="js/QuickHull.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;script&gt;
  
          if ( WEBGL.isWebGLAvailable() === false ) {
              document.body.appendChild( WEBGL.getWebGLErrorMessage() );
          }
          var camera, scene, renderer, controls;
  
          init();
          animate();
  
          function init() {
  
              renderer = new THREE.WebGLRenderer( { antialias: true } );
              renderer.setPixelRatio( window.devicePixelRatio );
              renderer.setSize( window.innerWidth, window.innerHeight );
              document.body.appendChild( renderer.domElement );
              scene = new THREE.Scene();
              camera = new THREE.PerspectiveCamera( 45.0, window.innerWidth / window.innerHeight, 5, 3500 );
              camera.position.z = 2500;
              controls = new THREE.TrackballControls( camera, renderer.domElement );
              createScene();
          }
  
          function createScene() {
                  scene = new THREE.Scene();
                  scene.background = new THREE.Color( 0x000000 );
                  var geometry = new THREE.BufferGeometry();
                  var positions = [];
  
  
                  for ( var i = 0; i &lt; 20; i ++ ) {
                      for ( var j = 0; j &lt; 20; j ++ ) {
                      var y = j;
                      var x = i; 
                      var z = 0;
                      positions.push( new THREE.Vector3(x, y, z) );
                      //positions.push( x, y, z );
  
                      }
                  }
  
  
                  //geometry.addAttribute( 'position', new THREE.Float32BufferAttribute( positions, 3 ) );
  
                  //var material = new THREE.PointsMaterial( {color: 0xFF0000} );
                  //points = new THREE.Points( geometry, material );
                  //scene.add( points );
  
                  var meshMaterial = new THREE.MeshBasicMaterial( {color: 0xffffff,} );
                  var meshGeometry = new THREE.ConvexBufferGeometry( positions );
                  var mesh = new THREE.Mesh( meshGeometry, meshMaterial );
                  scene.add( mesh );
  
  
          }
  
  
          function animate( time ) {
  
              requestAnimationFrame( animate );
              controls.update();
              renderer.render( scene, camera );
  
          }
  
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>