天天看點

three.js中動作動畫和blendshape混合播放,并且固定幀數

function animate() {
	render()
	stats.update();
}

function render(){
       //更新動作,動作的幀數無需控制,速度可以通過timeScale進行設定
	if ( mixers.length > 0 ) {
		mixers[0].update( clock.getDelta());
	}
	if(gui){
		if(gui.audio) playAudio()
	}
	renderer.render( scene, camera );
}
function playAudio(){
       //因為我使用的模型中,控制表情的blendshape系數是51個為一組,+102是因為降幀到30,+51則是60幀,但是60幀會抖動,是以需要降幀。
	process+=102;
	if(process>arr.length){
		audio_p.stop()
	}else {
		mesh_all[0].morphTargetInfluences=arr.slice(process,process+50)
	}
}
setInterval(animate,1000/30)
           

雖然動畫播放建議用requestAnimationFrame(animate),但是幀數不可控,因為此處的blenshape需要嚴格控制到每秒30幀,是以采用定時器進行實作。

繼續閱讀