Threejs - Click Drag Move Height

by black strings

HTML

<script src="https://rawgit.com/mrdoob/three.js/dev/build/three.js"></script>
<script src="https://rawgit.com/mrdoob/three.js/dev/examples/js/controls/OrbitControls.js"></script>
<div id="imgContainer">

</div>

JavaScript

// a basic line in 3D space used for a sense of dimension. Can be updated in real time.
class Line{
	constructor(start, end){
    this.start = start;
    this.end = end;
    this.geometry = new THREE.BufferGeometry();
    
     var vertices = new Float32Array([
      start.x, start.y, start.z,
      end.x, end.y, end.z,
    ]);

    // itemSize = 3 because there are 3 values (components) per vertex
    this.geometry.setAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) );
    
    this.mesh = new THREE.Line(this.geometry, new THREE.LineBasicMaterial({color: 0xff0000}));
    
  }
  update(height){
  	var yVector = new THREE.Vector3(0,1,0);
    yVector.setLength(height);
    var newEnd = this.start.clone();
    newEnd.add(yVector);
  	this.end.copy(newEnd);
    this.geometry.verticesNeedUpdate = true;
  }
}

// a proxy mesh/platform for selecting in 3D space. Will move up and down to mouse location on drag
class Level {
	constructor(vec3s, isMultiArray = false){
  	if(isMultiArray){
    	var deserializedVec3s = [];
    	vec3s.forEach((vec3) => {
      	deserializedVec3s.push(new THREE.Vector3(vec3[0], vec3[1]));
      });
      vec3s = deserializedVec3s;
      this.points = deserializedVec3s;
    } else {
    	this.points = vec3s;
    }
    
  	this.mesh = new THREE.Mesh();	// empty mesh
    this.mesh.name = 'grabspot container';
    
    // amount is the extrude settings
    var vec2s = vec3sToVec2s(vec3s);
    var extrudeSettings = {
        amount: .5,
        bevelEnabled: true,
        bevelSegments: 1,
        steps: 1,
        bevelSize: 0,
        bevelThickness: 1
      };
    var shape = new THREE.Shape(vec2s);
    var shapeGeo = new THREE.ExtrudeGeometry(shape, extrudeSettings);
    shapeGeo.applyMatrix(new THREE.Matrix4().makeRotationX(-Math.PI / 2));	// rotate 90
    shapeGeo.applyMatrix(new THREE.Matrix4().makeTranslation(0, 1.5, 0));	// offset y half
    var levelMat = new THREE.MeshStandardMaterial({color:0xffffff});
    this.mesh2d =...