Get Local Direction Vector v5(SO)

THREE.js OrbitControls DAT.GUI

by steveow

HTML

<script src="http://threejs.org/build/three.min.js"></script>
<script src="http://threejs.org/examples/js/controls/OrbitControls.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js"></script>

CSS

body {
  background-color: #000;
  margin: 0px;
  overflow: hidden;
}

JavaScript

//...see http://stackoverflow.com/questions/35663737/three-js-get-object-relative-local-orientation-of-a-scene-vector-with-given-worl/35852647#35852647 

var camera, scene, renderer;
var time = 0, dt = 0;
var PL_mesh;
var do_align = false;
var do_parallel = false;
var gcontrols;

init();
animate();
//======================================================================

function init() {

  scene = new THREE.Scene();
  scene.add(new THREE.AmbientLight(0x222222));

  camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 10000);
  camera.position.x = 50;
  camera.position.y = -120;
  camera.position.z = 800;
  camera.lookAt(0, 0, 0);
  scene.add(camera);

  // LIGHTS

  var ambientlight111 = new THREE.AmbientLight(0x666666);
  scene.add(ambientlight111);

  var directionalLight = new THREE.DirectionalLight(0xaaaaaa, 0.7);
  directionalLight.position.set(100, 100, 100);
  scene.add(directionalLight);

  //Plane02
  var Plane02Geo = new THREE.PlaneGeometry(450, 450);
  var Plane02Material = new THREE.MeshPhongMaterial({
    side: THREE.DoubleSide
  }, {
    color: 0x660000
  });
  Plane02 = new THREE.Mesh(Plane02Geo, Plane02Material);
  Plane02.position.set(0, 0, -120);
  scene.add(Plane02);

  //SPHERES
  var t_Geometry = new THREE.SphereGeometry(10, 20, 20);
  var t_Material = new THREE.MeshLambertMaterial({
    color: 0xffffff,
    opacity: 0.8
  });
  t_Material.transparent = true;
  target = new THREE.Mesh(t_Geometry, t_Material);
  scene.add(target);

  var s_Geometry = new THREE.SphereGeometry(15, 20, 20);
  var s1_Material = new THREE.MeshPhongMaterial({
    color: 0x888888
  });
  var s2_Material = new THREE.MeshPhongMaterial({
    color: 0x888888
  });
  var s3_Material = new THREE.MeshPhongMaterial({
    color: 0x888888
  });
  var s4_Material = new THREE.MeshPhongMaterial({
    color: 0x888888
  });

  s1 = new THREE.Mesh(s_Geometry, s1_Material);
  s2 = new THREE.Mesh(s_Geometry, s2_Material);
  s3 = new...