小编最近根据项目需求需要加载FBX模型,刚开始呢只需要部分模型,于是小编就每个模型加载一次,随着模型数据越来越多,开始后面发现电脑开始嗡嗡的想,手机也是加载一会就闪退了,于是呢就开始小编的研究之路啦~
1、首先这是官网给出的导入fbx模型的例子
var loader = new THREE.FBXLoader();
loader.load( '../model/fbx/Samba Dancing.fbx', function ( object ) {
//动画
mixers=object.mixer = new THREE.AnimationMixer( object );
var action = object.mixer.clipAction( object.animations[0]);
action.play();
object.traverse( function ( child ) {
if ( child.isMesh ) {
child.castShadow = true;
child.receiveShadow = true;
}
} );
//缩放
object.scale.set(0.5,0.5,0.5);
//位置
object.position.set(0,0,0);
scene.add( object );
} );
2、开始克隆fbx模型,由于找不到资料,我只能去github上找,然后发现上面说可以使用js的一个库SkeletonUtils。
import { SkeletonUtils } from 'three/examples/jsm/utils/SkeletonUtils.js'
var loader = new THREE.FBXLoader();
loader.load( '../model/fbx/Samba Dancing.fbx', function ( object ) {
//动画
mixers=object.mixer = new THREE.AnimationMixer( object );
var action = object.mixer.clipAction( object.animations[0]);
action.play();
object.traverse( function ( child ) {
if ( child.isMesh ) {
child.castShadow = true;
child.receiveShadow = true;
}
} );
//缩放
object.scale.set(0.5,0.5,0.5);
//位置
object.position.set(0,0,0);
scene.add( object );
//模型复制,如果需要大量复制,刻在下面进行循环
let meshBox = SkeletonUtils.clone(object)
meshBox.animations = object.animations
meshBox.mixer = new THREE.AnimationMixer(meshBox)
const action2 = meshBox.mixer.clipAction(meshBox.animations[0])
action2.play()
meshBox.position.set(0, 20, 0)
meshBox.scale.set(0.5, 0.5, 0.5)
sceneFish.add(meshBox)
} );
至此,小编学习fbx模型的加载和克隆就完毕啦~
网友评论