1.确保加载模型后模型有animations属性。
2.加载完模型后,在模型中定义mixer的变量值。
const loader = new GLTFLoader();
loader.load("./model/gltf/RobotExpressive/RobotExpressive.glb", function (gltf) {
// 赋值动画给mixer
mixer = new THREE.AnimationMixer(gltf.scene);
mixer.clipAction(gltf.animations[9]).play();
scene.add(gltf.scene);
});
3.定义时间间隔,直接初始化就行
clock = new THREE.Clock();
4.在重复渲染函数中加入以下代码,第2行到第5行
function animate () {
if (mixer) {
const delta = clock.getDelta();
mixer.update(delta);
}
renderer.render(scene, camera);
robotRef.value.appendChild(renderer.domElement);
requestAnimationFrame(animate);
}
来源:https://blog.csdn.net/weixin_38441229/article/details/132284976
