title: anchoring a geomety/mesh to it's corner for scaling three.js
body: <p>I'm create a rectangle in three.js based on 2 coordinates. The first coordinate is the cell of the first user click, the second coordinate is where the user drags the cursor.</p>
  
  <p>The rectanlge that is being created is the correct size, however it 'grows' from it's center, whereas I want it to 'grow' from the corner of the first user click. I've tried a few potential solutions to change the origin of the geometry but I haven't found a fix yet.</p>
  
  <p><a href="http://3dblueprint.uk/test/" rel="nofollow noreferrer">The demo can be see here</a> - with the code below.</p>
  
  <pre><code>    var startPoint = startPlace;
      var endPoint = endPlace;
      var zIntersect = new THREE.Vector3(startPoint.x, 0, endPoint.z);
      var xIntersect = new THREE.Vector3(endPoint.x, 0, startPoint.z);
  
      var differenceZ = Math.abs(startPlace.z - zIntersect.z);
      var differenceX = Math.abs(startPlace.x - xIntersect.x);
      floorGeometryNew.rotateX(-Math.PI / 2);
  
  
      var floorGeometryNew = new THREE.PlaneGeometry(differenceX, differenceZ);
      floorGeometryNew.rotateX(-Math.PI / 2);
  
      var x = startPoint.x;
      var y = startPoint.y;
      var z = startPoint.z;
  
      var voxel = new THREE.Mesh(floorGeometryNew, tempMaterial);
      voxel.position.set(x, y, z);
  </code></pre>