A-Frame: как оживить Orbit-Controls?

Question

Я играю с компонентом контроллера Orbit от ngokevin, и у меня есть некоторые проблемы с анимацией.

Мой контекст прост: у меня есть 3D-сцена с различными элементами, которые после нажатия должны переместить камеру, чтобы "посмотреть на них".

До сих пор я был в состоянии динамически изменить орбиту targetи как-то это работает:

AFRAME.registerComponent( 'mytest-click', {
  schema: {
    active: { type: "boolean" }
  },
  init: function () {
    var data = this.data;
    var el = this.el;
    el.addEventListener( 'click', function ( evt ) {
      // Calculate real position
      var targetPosition = new THREE.Vector3();
      targetPosition.setFromMatrixPosition( evt.target.object3D.matrixWorld );
      var cameraPosition = document.querySelector( '#camera' ).getAttribute( 'position' );

      targetPosition.y -= cameraPosition.y;

      var currOrbit = document.querySelector( '#camera' ).getAttribute( 'orbit-controls' );
      currOrbit.target = targetPosition;
      document.querySelector( '#camera' ).setAttribute( 'orbit-controls', currOrbit );
    } );
  }
});

Моя проблема в том, что я не могу оживить это.. Я пробовал с анимацией, как animation__test="property: orbit-controls.target; ..." бот это не работает..

Любая идея?

Answer 1

В итоге я адаптировал плагин Orbit-controls для использования плагина Camera Controls.

Я буду предупрежден: это, наверное, самый уродливый и грязный способ сделать это, я просто адаптировал методы, которые мне были нужны. Используйте на свой риск.

Это ссылка на репо