トゥイーンの位置が終了した後にオブジェクトを非表示にします。

Question

このオブジェクトのトゥイーン位置を実行していたら、終了したらフェードアウトします...終了したらすぐに隠しています。 真 __webglInit ： 真 _modelViewMatrix ： THREE.Matrix4 _normalMatrix ：ここ

this.tweenBox2.onUpdate(function() 
{ 
      that.box.position = a; 
      that.box.Show(); 
}); 
this.tweenBox2.onComplete(function() { 
      for (var i = 0; i < that.box.children.length; i++) { 
       that.box.children[i].visible = false; 
      } 
      that.box.position = new THREE.Vector3().copy(storagePos); 
}); 

は内部box.children [0]

THREE.Mesh 

webglActive は何かということです THREE.Matrix3 castShado 偽子供 ： は、配列[0] eulerOrder： （...） をfrustumCulled： 真幾何 ： THREE.Geometry ID： 材料： W THREE .MeshLambertMaterial matrix ： THREE.Matrix4 matrixAutoUpdate ： matrixWorld 真： THREE.Matrix4 matrixWorldNeedsUpdate ： 偽 名 ： "" 親 ： ボックス 位置 ： THREE.Vector3 四元 ： THREE.Quaternion receiveShadow ： false renderDepth ： null 回転 ： THREE.Euler rotationAutoUpdate ： 真 規模 ： THREE.Vector3 アップ： THREE.Vector3 useQuaternion ： （...） のuserData ： オブジェクト UUID ： "9C6DC789-20D0-4F9F-88B6-CDA9A2C372B9" 可視 ： 真 __proto ： THREE。あなたがtrueにその透明度を設定する必要があなたの箱のための材料を作成すると

var box = boxModel.scene.children[3].children[0].clone(); 
box.traverse(function (child) 
{ 
    if (child instanceof THREE.Mesh) 
    { 
     child.material = child.material.clone(); 
    } 
}); 

Answer 1

：材料がこのように作成され

Object3D

material = new THREE.MeshPhongMaterial({color: 0x00ff00, transparent: true}); 

を私はPhongMaterialを使用していますが、それは問題ではありません。あなたはその位置のために行うよう

その後、あなたにonUpdate機能であなたは、その不透明度を変更することができます。

this.tweenBox2.onUpdate(function() 
{ 
      that.box.position = a; 
      //This will fade the opacity from 0 to 1 
      //NOTE: I'm considering "box" as a THREE.Mesh 
      that.box.material.opacity = 0; 

      that.box.Show(); 
}); 

は、私はあなたがonCompleteの機能を必要としないと思います。

アップデート1：

var opacityVar = 1; 

はその後フェードアウト機能：

function fadeOut(){ 

    if(opacityVar >= 0){ 

     mesh.material.opacity = opacityVar; 
    } 
} 

そしてレンダリング機能で私は 私は不透明度の値を格納するグローバル変数を作成しました不透明度varを更新し、関数onCompleteを呼び出すfadeOutを呼び出します。

function render() { 

    camera.lookAt(scene.position); 

    renderer.render(scene, camera); 

    opacityVar -= 0.01; //Update opacity var 

    fadeOut(); //Call FadeOut 

}