AFrameアニメーションをjavascriptから特定の場所にトリガする方法はありますか？

たとえば、キューブをクリックし、以前に定義したJS変数（ポイント「p」と呼ぶ）に基づいて、別のキューブがそのポイント「p」に移動（アニメーション化）します。言い換えれば、その場でAFrameアニメーションを定義して有効にする方法はありますか？どうもありがとう。AFrameアニメーションをjavascriptから特定の場所にトリガする方法はありますか？

出典

2016-12-24 hyperdo

ターゲットボックスの下に<a-animation>要素を追加できます。 Animation-A-Frame

<script src="https://cdnjs.cloudflare.com/ajax/libs/aframe/0.3.2/aframe.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<title>move animation</title> 
 
<script> 
 
AFRAME.registerComponent("move",{ 
 
schema : { 
 
    target : { type : "selector"}, 
 
    position : {type : "string"} 
 
}, 
 
init : function(){ 
 
\t this.el.addEventListener("click",function(){ 
 
      var animation = document.createElement("a-animation"); 
 
      animation.setAttribute("attribute","position"); 
 
      animation.setAttribute("to",this.data.position); 
 
      animation.setAttribute("dur","1000"); 
 
      animation.setAttribute("repeat","0"); 
 
      this.data.target.appendChild(animation); 
 
\t }.bind(this)); 
 
} 
 

 
}); 
 
    </script> 
 
</head> 
 
<body> 
 
<a-scene> 
 
    <a-camera position="0 0 0" universal-controls> 
 
    <a-entity id="cursor" cursor="fuse: true;fuseTimeout:500" 
 
    \t material="color:black" 
 
    \t geometry="primitive:ring" 
 
    \t position="0 0 -1" 
 
    \t scale="0.01 0.01 0.01" 
 
    ></a-entity> 
 
    </a-camera> 
 
<a-box id= "blue_box" position="0 1 -2" color="blue" ></a-box> 
 
<a-box position="1 1 -2" color="red" move="target:#blue_box;position:-1 0 -5"></a-box> 
 
</body> 
 
</html>

出典

2016-12-24 02:53:47

AFrameアニメーションをjavascriptから特定の場所にトリガする方法はありますか？

答えて

関連する問題