Catmull-Rom Spline

HTML

<div id="info">Catmull-Rom Curve
  <br>Right click to add data points
  <br>
  <button id="makeCurve" style="width:20%">Make Curve</button>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r78/three.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js"></script>
<canvas id='mycanvas'>
  <canvas>

CSS

#info {
  position: absolute;
  top: 0px;
  width: 100%;
  padding: 10px;
  text-align: center;
  color: #ffff00
}

#gui {
  position: absolute;
  top: 0px;
  left: 0px;
  border: solid 1px green;
  //height: 350px;
}

body {
  overflow: hidden;
}

JavaScript

// to deactivate default right button events
document.oncontextmenu = function() {
  return false;
}

var camera, scene, renderer;
var mousePoint;
var mouse = new THREE.Vector2();
var dataPoints = [];
var dataPointGroup = new THREE.Object3D();
var gcontrols;
var resController;
var typeController;
var mycanvas;

init();
animate();

$("#makeCurve").click(function() {
  console.log('in makeCurve');
  makeCatmullRom();
});

function init() {

  mycanvas = document.getElementById('mycanvas');
  renderer = new THREE.WebGLRenderer({
    antialias: true,
    canvas: mycanvas
  });

  renderer.setSize(window.innerWidth, window.innerHeight);
  renderer.setClearColor(0x888888);
  //  document.body.appendChild(renderer.domElement);

  scene = new THREE.Scene();
  camera = new THREE.OrthographicCamera(-10, 10, 10, -10, -10, 100);
  camera.position.z = 10;
  scene.add(camera);

  var gridXZ = new THREE.GridHelper(10, 1, 'red', 'white');
  scene.add(gridXZ);
  gridXZ.rotation.x = Math.PI / 2;

  scene.add(dataPointGroup);

  document.addEventListener('resize', onWindowResize, false);
  mycanvas.addEventListener('mousedown', onDocumentMouseDown, false);

  gcontrols = {
    resolution: 20,
    closed: false,
    type: "centripetal"
  };

  var gui = new dat.GUI();
  gui.domElement.id = 'gui';

  resController = gui.add(gcontrols, 'resolution', 10, 50);
  closedController = gui.add(gcontrols, 'closed');
  typeController = gui.add(gcontrols, 'type', ["centripetal", "chordal", "catmullrom"]);
}

function makeCatmullRom() {

  var cat;
  // if line exists, remove it...
  if (cat = scene.getObjectByName('catmull')) {
    scene.remove(cat);
    cat.children[0].geometry.dispose();
    cat.children[1].geometry.dispose();
  }

  var curve = new THREE.EllipseCurve(
	0,  0,            // ax, aY
	10, 10,           // xRadius, yRadius
	0,  2 * Math.PI,  // aStartAngle, aEndAngle
	false,            // aClockwise
	0                 // aRotation
);
  curve.type = gcontrols.type;
  curve.closed...