How to listen to the world position of the camera in A-Frame?

Question

How to get the current camera position? So that I can turn my sky

Suppose I have:

<a-scene> <a-camera id="camera></a-camera> <a-sky id="mySky"></a-sky> </a-scene> 

Answer 1

To get the camera position:

 var pos = document.querySelector('#camera').getAttribute('position'); 

To get the world position of the camera, we can transform the local position of the camera:

 var cameraEl = document.querySelector('#camera'); var worldPos = new THREE.Vector3(); worldPos.setFromMatrixPosition(cameraEl.object3D.matrixWorld); console.log(worldPos.x); 

To listen for changes, use the componentchanged event:

 cameraEl.addEventListener('componentchanged', function (evt) { if (evt.detail.name !== 'position') { return; } console.log(evt.detail.newData); }); 

More polls may be polls:

 AFRAME.registerComponent('camera-listener', { tick: function () { var cameraEl = this.el.sceneEl.camera.el; cameraEl.getAttribute('position'); cameraEl.getAttribute('rotation'); // Do something. } });