CODEWITHSUNDEEP
javascriptthree.js
Rotar Paul
Rotar Paul

Reputation: 129

ThreeJS, get vector towards clicked direction

What I'm trying to achieve is to make a specific mesh move towards a specific vector until it will eventually be stopped by the player.

So far I have managed to get the XY coordinates of the clicked canvas and project them in 3d using the following piece of code. Unfortunately I'm not sure what approach to take in order to get the direction towards the clicked position.

var vector = new THREE.Vector3();

vector.set(
    ( event.clientX / window.innerWidth ) * 2 - 1,
    + ( event.clientY / window.innerHeight ) * 2 + 1,
    0.5 );

vector.unproject( camera );

var dir = vector.sub( camera.position ).normalize();

var distance = + camera.position.z / dir.z;

var pos = camera.position.clone().add( dir.multiplyScalar( distance ) );

Upvotes: 0

Views: 487

Answers (1)

dcromley
dcromley

Reputation: 1420

This assumes a target Vector3 and a maximum distance to be moved per frame of .01.

  var vec1 = target.clone(); // target
  vec1.sub(mesh.position); // target - position
  var dist = Math.min(vec1.length(), .01); // assume .01 is maximum movement
  if (dist > 0) {
    vec1.setLength(dist); // this will be the movement
    mesh.position.add(vec1); // this moves the messh
  }

Upvotes: 1

Related Questions