イベントエミッションでイベントアニメーションが発生しない（またはイベントが発生しない）

Question

私のシーンにテキスト要素とスカイボックスがあります。シーンが初期化されるとき、テキストをその位置に一度アニメーション化します。

<!-- scene elements --> 
<a-scene coogee2006-scene embedded style="width:100%;height:400px;"> 
    <a-assets> 
     <img 
      id="coogee2006" 
      src="/assets/vr/sydney-coogee-3-peter-gawthrop.jpg" 
      preload="auto"> 
     <audio 
      id="beachsound" 
      src="/assets/vr/beach1.wav" 
      preload="auto"> 
    </a-assets> 

    <a-sky src="#coogee2006" 
     rotation="0 -90 0"> 
    </a-sky> 

    <!-- text animates in on startup (see searise_vr.js) --> 
    <a-text 
     id="coogee2006-text" 
     value="Coogee, Sydney\n2006" 
     position="5 12.5 -50" 
     rotation="0 -15 0" 
     scale="20 20 20" 
     visible="true" 
     text="anchor:align;alphaTest:0.2;width:5; 
     value:COOGEE, SYDNEY\n2006; 
     zOffset:0;color:#000;font:exo2bold" 
     sound="src:#beachsound;autoplay:true;loop:true;volume:20;"> 
     <a-animation 
      attribute="position" 
      dur="3000" 
      begin="coogeetour" 
      to="12.5 12.5 -50" 
      easing="ease-in" 
      fill="both" 
      repeat="0"> 
     </a-animation> 
    </a-text> 
</a-scene> 

私はbegin=5000と静的な遅延時間を設定した場合、それは正常に動作しますが、私はbegin="coogeetour"のように、イベントでそれを設定しようとすると、アニメーションが発生しません。

<script> 
    AFRAME.registerComponent('coogee2006-scene', { 

    // emit text events when the scene is initialised 
    init: function() { 
     console.log('Running coogee2006-scene.init()'); 
     document.querySelector("#coogee2006-text").emit('coogeetour'); 
    } 
    }); 
</script> 

：スクリプトタグ上記 a-sceneタグで、シーンのためのコンポーネントを登録し、特定のテキスト要素をdocument.querySelector()を使用することにより、

まず：私はイベントに二つの方法を発射しようとしました

：テキスト要素ためのコンポーネントを登録してthis.elを使用して、A-フレームWriting a Componentセクションのように、およびリンクされている外部ファイルでこれを置くことによって

第二に、

AFRAME.registerComponent('coogee2006-text', { 

    // emit text events when the scene is initialised 
    init: function() { 
    console.log('Initialising text element'); 
    this.el.emit('coogeetour'); 
    } 
}); 

いずれの場合も、console.logが機能するため、コンポーネントは初期化されていますが、アニメーションは起こっていません。デバッグ時に要素のイベントリスナーにcoogeetourが見つかりませんでしたが、emit()が正しく動作していないか、デバッグに表示されないためです。

EDIT：ここ負荷に私のコンソールログです：

Navigated to http://127.0.0.1:4000/private/JoQyfM/ 
index.js:73A-Frame Version: 0.5.0 (Date 10-02-2017, Commit #110055d) 
index.js:74three Version: ^0.83.0 
index.js:75WebVR Polyfill Version: dmarcos/webvr-polyfill#a02a8089b 
browser.js:117 core:a-assets:warn Asset loading timed out in +0ms 3000 ms 
three.js:19590 THREE.WebGLRenderer 83 
(index):81 Running coogee2006-scene.init() 
browser.js:117 components:sound:warn All the sounds are playing. If you need to play more sounds simultaneously consider increasing the size of pool with the `poolSize` attribute. +118ms 
three.js:17507 THREE.WebGLRenderer: image is not power of two (5980x2990). Resized to 8192x4096 <img crossorigin=​"anonymous" src=​"/​assets/​vr/​sydney-coogee-3-peter-gawthrop.jpg">​ 

Answer 1

理由はわかりませんが、コンポーネントメソッドがemit()イベントを飲み込んでいるようです。同じ電話をupdate()機能に入れてみましたが、それでも機能しませんでした。仕事がタイムアウトで発光コールを置くために何をしたの

：

setTimeout(function() { document.querySelector("#coogee2006-text").emit('coogeetour'); }, 0); 

Codepen：http://codepen.io/shanabus/pen/zZYBaa

Answer 2

さて、beginは数値のみで動作するように見えます。 delayは数値とイベント名の両方で動作します。公正であるためには、これはアニメーションのためにattribute tableに記述されていますが、その下にあるbegin属性のブロックには、イベント名とともに使用されている例が示されています。おそらく償却された属性ですか？

編集：大丈夫でしょう、これは答えではないかもしれません。 delayとbeginの両方が存在する理由は完全にはわかりませんが、イベントトリガーの後に遅延が存在する可能性がありますか、またはdelayが償却されましたか？