Search code examples
javascriptaframewebvr

What is the best way to track teleport position in Aframe?


I am using the aframe-teleport-controls and I was wondering what is the best way to track the position of the user.

I've been searching and I found two ways to do that.

1 - I use the position of the teleport controller which is almost the position of the user.

var teleportControls = el.closest('a-scene').querySelector('[teleport-controls]');
var worldPos = new THREE.Vector3();
worldPos.setFromMatrixPosition(teleportControls.object3D.matrixWorld);
console.log(worldPos);

2 - I define an a-camera element in my scene and I use his position.

var teleportControls = el.closest('a-scene').querySelector('a-camera');
var worldPos = new THREE.Vector3();
worldPos.setFromMatrixPosition(teleportControls.object3D.matrixWorld);
console.log(worldPos);

I'm not sure it is the good practice, and how can I listen that the user change his position?

Thanks for reading this.


Solution

  • The controller element (not the camera) will emit a teleport event when the user teleports (found in source here). The easiest way to detect those events would be to listen on the scene element, as the events bubble up.

    sceneEl.addEventListener('teleport', function (e) {
      console.log(e.detail.oldPosition, e.detail.newPosition);
    });