Basic OrbitControls

by Julian Rojas

HTML

<script src="http://mrdoob.github.com/three.js/build/three.min.js"></script>
<script src="http://mrdoob.github.com/three.js/examples/js/controls/OrbitControls.js"></script>
<div id="container"></div>

JavaScript

// Neslisah Torosdagli

var container, renderer, scene, camera, controls;

var branches = 3;
var levels = 3;
var linesDrawn = 0;

init();
animate();

function rotateAroundPoint(center, point, angle) {
  var s = Math.sin(angle);
  var c = Math.cos(angle);

  point = point.sub(center);

  var x = (point.x * c) - (point.y * s);
  var y = (point.x * s) + (point.y * c);

  x = x + center.x;
  y = y + center.y;
  var z = point.z + center.z;

  return (new THREE.Vector3(x, y, z));
}

function buildTree() {

  var material = new THREE.LineBasicMaterial({
    color: 0x0000ff
  });

  var length = 10;

  var rootLineStart = new THREE.Vector3(0, -length, 0);
  var rootLineEnd = new THREE.Vector3(0, 0, 0);

  var root = new THREE.Geometry();
  root.vertices.push(rootLineStart);
  root.vertices.push(rootLineEnd);
  var line = new THREE.Line(root, material);
  scene.add(line);

  var point = rootLineEnd.clone();
  var v1 = rootLineStart.clone();
  var v2 = rootLineEnd.clone();
  var dir = v2.clone().sub(v1).normalize();

  var materials = [];

  var lineCount = 0;

  for (var l = 0; l < levels; l++) {
    var c = randomColor();
    var m = new THREE.LineBasicMaterial({
      color: c
    });
    materials.push(m);
    if (l > 0) {
      lineCount += Math.pow(branches, l);
    }
  }

  points = [];
  points.push(rootLineEnd.clone());
  points.push(dir);
  points.push(length);

  var startAngle = Math.PI / 2;
  var stepAngle = Math.PI / (branches - 1);

  while (points.length >= 2) {

    var centerPoint = points.shift();
    var direction = points.shift();
    var len = points.shift();

    var l = Math.log2(length / len);
    material = materials[l];

    var angle = -startAngle;

    for (var idy = 0; idy < branches; idy++) {

      var point = centerPoint.clone().add(direction.clone().multiplyScalar(len / 2));
      var rotatedPoint =
        rotateAroundPoint(centerPoint, point, angle);

      var geometry = new THREE.Geometry();

     ...