Сброс object3d в исходное положение и поворот - PullRequest
0 голосов
/ 04 октября 2019

У меня есть модель gltf с анимацией, которую я позволяю пользователю запускать / останавливать, нажимая кнопку воспроизведения. Хотя я могу остановить воспроизведение анимации, когда пользователь нажимает «Стоп», я не могу вернуть модель в исходное положение и повернуть.

Вот мой код

 <a-entity gltf-model="#character" texture-map="map: map" position="0 0 -7"></a-entity>

, а вот часть кода в карте текстуры компонента, которая пытается сбросить модель обратно в исходное положение 0, 0 -7

  play.addEventListener("click", (e)=> {
    if (play.innerHTML === "Stop"){
      play.innerHTML = "Play";
      this.el.pause();
      this.el.removeAttribute("animation-mixer");  
      let position = new THREE.Vector3(0, 0, -7);
      this.el.object3D.position.copy(position); 
      this.el.object3D.matrixWorldNeedsUpdate = true;
      this.el.object3D.updateMatrixWorld(); */
      this.el.object3D.lookAt(-3, 0, 0);
    }
    else{
      play.innerHTML="Stop";
      this.el.setAttribute("animation-mixer", "clip", "catwalk");
      this.el.play();                  
    }
})

Когда я выполняю этот код и нажимаю кнопку «Стоп», анимация останавливается, но положение модели и поворот не сбрасываются. Может ли кто-нибудь помочь мне с этим вопросом?

1 Ответ

1 голос
/ 04 октября 2019

Вы управляете анимацией, используя компонент animation-mixer. https://github.com/donmccurdy/aframe-extras/tree/master/src/loaders

Просто взглянув на API для этого, возможно, вы могли бы установить свойство цикла равным «один раз», а шкалу времени - для некоторого большого числа отрицательных чисел, например -100. Теоретически, это заставит анимацию воспроизводиться задом наперед, очень быстро, а затем остановится после завершения. Я никогда не пробовал это, так что не знаю, сработает ли это, но, похоже, могло бы. С другой стороны, если вы очень смелы, вы можете загрузить исходный код для микшера анимации и попытаться создать собственное свойство или метод, который установит для фрейма анимации начальное время или любой другой фрейм, который вам нравится.

 play.addEventListener("click", (e)=> {
    if (play.innerHTML === "Stop"){
      play.innerHTML = "Play";
      this.el.setAttribute('animation-mixer',"clip: catwalk; loop: once; duration: .1");
    }
    else{
      play.innerHTML="Stop";
      this.el.removeAttribute("animation-mixer");  
      this.el.setAttribute("animation-mixer", "clip: catwalk; loop: repeat; duration: 15");
    }
  })
...