前言
该文章主要讲元宇宙虚拟空间的加载管理,基本核心技术点,不多说,直接引入正题。
加载管理的处理
使用引入的加载模块
let loadingManager = new LoadingManager(this);
对引入的加载模块,设置时间因子调整为0(时间因子:在这里是指页面与时间相关的要素,当这个数是0时,页面将会呈现一个缓慢时间的效果)对每个加载做跟踪监听
this.world.setTimeScale(0);
当加载管理界面加载完毕,时间因子再调整为1,并且调用Swal库的弹出框,当关闭弹窗显示UI调试开发界面方便后续操作
loadingManager.onFinishedCallback = () =>
{
this.update(1, 1);
this.setTimeScale(1);
Swal.fire({
title: '欢迎来到虚拟空间!',
text: '',
footer: '< ',
confirmButtonText: 'Okay',
buttonsStyling: false,
onClose: () => {
UIManager.setUserInterfaceVisible(true);
}
});
};
关于场景的加载,判断建模是否有定义的属性,判断是否为物体,凡是物体都要对材质进行一个初始化修改(因为要做级联阴影的效果),如果是一些特别的材质,就要对它进行创建,然后把它添加到世界的更新表单中。
当然关于场景里的一些效果碰撞等特殊事件,也要在这个场景加载里面进行调用,,后续会讲到.
gltf.scene.traverse((child) => {
if (child.hasOwnProperty('userData')) {
if (child.type === 'Mesh'){
Utils.setupMeshProperties(child);
this.sky.csm.setupMaterial(child.material);
if (child.material.name === 'ocean'){
this.registerUpdatable(new Ocean(child, this));
}
}
}