元宇宙虚拟空间的加载管理(三)

前言

该文章主要讲元宇宙虚拟空间的加载管理,基本核心技术点,不多说,直接引入正题。


加载管理的处理

使用引入的加载模块

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));

}

}

}

相关推荐
WebGISer_白茶乌龙桃20 小时前
基于 Cesium 的 GLB 建筑模型分层分房间点击拾取技术实现
前端·javascript·vue.js·webgl·cesium
sin°θ_陈20 小时前
前馈式3D Gaussian Splatting 研究地图(路线一):像素对齐高斯的起点——pixelSplat 与 latentSplat 在解决什么
python·深度学习·3d·aigc·webgl·3dgs·空间智能
就是个名称1 天前
Chrome使用cesium.js或者three.js报错不支持webGL
javascript·chrome·webgl
烛阴2 天前
Three.js 场景完全入门指南:让你的 3D 场景不在乱成一团
webgl·three.js
EliseL3 天前
SuperMap iClient3D for WebGL 如何实时汇报相机位置天气情况
javascript·3d·html·webgl
loriloy3 天前
Three.js初学者到高级开发工程师的完整学习路径
threejs
ct9783 天前
Cesium的时间与时钟系统
gis·webgl·cesium
Jay-r3 天前
樱花雨特效 WebGL实现 短视频同款浪漫视觉效果(附源码下载)
开发语言·javascript·ecmascript·编程·webgl·代码·樱花雨
棋鬼王3 天前
Cesium(八) 三峡大坝水淹分析,江、湖、水库、大坝水淹决堤分析
3d·信息可视化·智慧城市·webgl·cesium
平行云PVT3 天前
数字孪生信创云渲染技术解析:从混合信创到全国产化架构
linux·unity·云原生·ue5·图形渲染·webgl·gpu算力