У меня есть артефакт атрибута material.opacity, появляющийся во время воспроизведения цикла анимации

Кажется, у меня есть артефакт, отображаемый в анимации непрозрачности в каждом другом цикле анимации. Порядок сегментов анимации material.opacity, похоже, как-то перепутан. Есть ли способ реализовать анимацию material.opacity, чтобы последовательности оставались в порядке для каждого цикла? Пожалуйста, смотрите анимацию codenippet.

<html>

<head>
  <script src="https://aframe.io/releases/0.3.0/aframe.min.js"></script>
</head>

<body>
  <a-scene>
    <a-assets>
      <a-mixin geometry="height:5" id="tall"></a-mixin>
      <a-mixin geometry="width:5" id="wide"></a-mixin>
      <a-mixin geometry="height:2" id="short"></a-mixin>
      <a-mixin geometry="width:2" id="narrow"></a-mixin>
      <a-mixin geometry="primitive:box" id="cube"></a-mixin>
      <a-mixin material="color:red" id="red"></a-mixin>
    </a-assets>
    <a-entity geometry="primitive:torusKnot;p:3;q:5" material="color:yellow" position="0 0 -10">
      <a-animation attribute="material.color" delay="0" from="yellow" to="blue" repeat="indefinite" dur="3600"></a-animation>
      <a-animation attribute="material.opacity" delay="0" from="1" to="0.75" repeat="indefinite" dur="1200"></a-animation>
      <a-animation attribute="material.opacity" delay="1200" from="0.75" to="0.25" repeat="indefinite" dur="600"></a-animation>
      <a-animation attribute="material.opacity" delay="1800" from="0.25" to=".75" repeat="indefinite" dur="600"></a-animation>
      <a-animation attribute="material.opacity" delay="2400" from="0.75" to="1" repeat="indefinite" dur="1200"></a-animation>
    </a-entity>
    <a-entity mixin="cube tall narrow red" geometry="depth:3" position="0 6 -20" light="type: point; intensity:1">
      <a-animation attribute="rotation" from="0 0 0" to="0 0 360" repeat="indefinite" dur="3600"></a-animation>
      <a-animation attribute="position" from="0 6 -20" to="0 6 0" repeat="indefinite" dur="3600"></a-animation>
      <a-animation attribute="scale" from="1 1 1" to="0.1 0.1 0.1" repeat="indefinite" dur="3600"></a-animation>
    </a-entity>
    <a-sky color="#abc"></a-sky>
  </a-scene>
</body>

</html>

Источник

0 ответов

Другие вопросы по тегам