2
votes

I've got a component to animate to a position in front of the camera, but when it's a child of another object this is animating in the wrong direction (away from the camera) because it's using the world position in an entity.

I know it's because of world coordinates.. can anyone help tell me how to convert this world position into local coordinates?

    pLocal= new THREE.Vector3(0, 0, -distX)
   this._targetPosition = pLocal.applyMatrix4(this._threeCamera.matrixWorld)

I this example the box is a child of the sphere and animates away from the camera. https://jsfiddle.net/jpvsrnq1/2/

If the box is not a child it animates towards camera. https://jsfiddle.net/jpvsrnq1/3/

How do I make it animate to camera when it's a child of another object?

1

1 Answers

2
votes

You should use the worldToLocal() method:

from the docs:

.worldToLocal ( vector : Vector3 ) : Vector3
Updates the vector from world space to local space.

by using the method on your parent: parentObj.worldToLocal(vec) you can apply its world position to the local position vector. Fiddle here.

Fiddle here.


Another way would be looping through parent entities, and subtracting their positions, but it doesn't seem to have any advantage over the worldToLocal method