AフレームfadeOutプリミティブ

Question

フレームに問題があります。 遅延のあるシーンからコンポーネントまたはプリミティブを削除する方法はありますか？ jQueryのfadeOutと同じですか？

opacity CSSのプロパティまたは特別なclassNameまたはsmthのすべてのチェックをチェックする必要がありますか？

プリミティブをng-repeatからフェードアウトしたい場合は、ng-animateを使用して.ng-leaveクラスをチェックする必要がありますか？

理想的には、remove()のコンポーネントまたはプリミティブの機能でalgorythmを宣言したいと考えています。たとえば、私がremove（）関数でPromiseを返した場合、promise resolveでObject3Dを削除します。しかし、それは、このようにしていない実装だ、と私は行き詰まってきた:(

ルック例：http://codepen.io/Disorrder/pen/BWBKpb

Answer 1

http://codepen.io/jdoyle/pen/aJoVJj

を私の知る限り、不透明度のCSSプロパティは、オブジェクトには影響しませんこのため、.ng-leaveを使用することはできません。不透明度をアニメーション化する唯一の方法は、アニメーションコンポーネントを使用する方法とプログラムによる方法です。

$timeoutプロバイダーを使用し、アニメーションを知る期間、何かを設定することができます

<a-box ng-repeat="box in page.getActiveBoxes() track by box.id" 
     ng-class="{animated: page.animate}" 
     position="{{box.position}}" 
     rotation="0 45 0" 
     width="0.6" height="1" depth="0.6" 
     color="{{box.color}}" 
    > 
    <a-animation attribute="opacity" begin="fadeOut" duration="5000" to="0"></a-animation> 
</a-box> 

fadeOut() { 
    var id = this.getRandomInt(0, this.boxes.length-1); 
    document.querySelector('#box-' + id).emit('fadeOut'); 
    this.$timeout(function() { 
    // you can now delete the primitive 
    }, 5000 + 50); // added 50ms for good measure 
} 

getRandomInt(min, max) { 
    min = Math.ceil(min); 
    max = Math.floor(max); 
    return Math.floor(Math.random() * (max - min)) + min; 
} 

これは最も洗練された解決策ではありませんが、私は本当に別の方法を考えることはできません。

もう1つの失望の角度補間は、アニメーションのdurationプロパティでは機能しません。一度設定した時間は変更できません。これはうまくいかないでしょう：

<a-animation attribute="opacity" duration="{{page.animationDuration}}" begin="fadeOut" to="0"></a-animation> 

Answer 2

私は混乱しているかもしれません、それを削除しようとしているのですか？内蔵のAnimationsをAフレームで使用することを検討することができます。ここの例：https://aframe.io/docs/0.5.0/core/animations.html#begin

これで削除されませんが、jQuery（2番目の質問）はfadeOut()の要素を削除しません。