Анимация камеры в зависимости от события

Question

С помощью простого кода можно перемещать положение камеры при нажатии на объект. Но возможно ли анимировать камеру для перехода на эти позиции?

Это мой код:

<a-scene> 
     <a-entity > 

      <a-box id="box01" color="#6173F4" position="1 0 0"></a-box> 
      <a-box id="box02" color="#6173F4" position="-1 0 0"></a-box> 
      <a-camera id="cam"> 
       <a-cursor></a-cursor> 
      </a-camera> 
      <script> 
      var cam = document.querySelector('#cam'); 
      var caja1 = document.querySelector('#box01'); 
      var caja2 = document.querySelector('#box02'); 

      caja1.addEventListener('click', function() { 
       cam.setAttribute('position' , {x: 1, y: 0, z: 4}); 
       cam.setAttribute('rotation' , {x: 0, y: 0, z: 0}); 
      }); 
      caja2.addEventListener('click', function() { 
       cam.setAttribute('position' , {x: -3, y: 3, z: 4}); 
       cam.setAttribute('rotation' , {x: -30, y: -30, z: 0}); 
      }); 
      </script> 
     </a-entity> 
    <a-text value="Hello, A-Frame!" color="#FFF" 
    position="0 0 1" scale="1.5 1.5 1.5"></a-text> 
    <a-sky color="#4069b4"></a-sky> 
</a-scene> 

Answer 1

Дон McCurdy имеет вы охвачены. Проверьте свою демонстрацию, которая может быть именно тем, что вы хотите: https://sandbox.donmccurdy.com/checkpoints/ (исправлена ​​неработающая ссылка)