補(bǔ)間動畫,顧名思義就是補(bǔ)充mesh從初始位置到結(jié)束位置的動畫,然后其顯得有過渡,自然.

1. 引入Tween.js

script標(biāo)簽引入,這個都不會,只能回去繼續(xù)切圖了--_--

2. 設(shè)置更新

常規(guī)來講,three.js都會有一個動畫函數(shù),有的人明明為render,有的明明為animate

function render(){

? ? ......

? ? obritControls.update(); // 與本話題無關(guān),只是方便某些童鞋找到某個函數(shù),畢竟幾乎是必備的一個控制器了

? ? TWEEN.update();// 請注意是大寫的

}

3. 初始化一個實(shí)例

例如,你有很多個mesh需要做動畫,還是那么可以定義一個函數(shù)

function getTween(){

? ? return new TWEEN.Tween(obj.position,要改變的某一個屬性).to(到達(dá)某個屬性的某個值,例如這里的position,需要傳入,兩個參數(shù):{x:tartgetVal,y:targetVal,z:targetVal},duration,也就是動畫時間).easing(TWEEN.Easing.Quartic.InOut,動畫方式,只要有點(diǎn)css3的基礎(chǔ)都可以理解的).toUpdate(回調(diào)函數(shù)).start(開始函數(shù));

// 如果要實(shí)現(xiàn)依次動畫或者無限循環(huán)動畫,可以使用chain方法,具體實(shí)現(xiàn)可以自行解決,最簡單的辦法就是搞一個數(shù)組存儲,依次開始動畫(不過,這樣比較蠢);

}