元宇宙虚拟空间的场景构造(二)

前言

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


场景的构造

使用引入的天空模块

this.sky = new Sky(this);

在Sky模块里,有设置对其中的阳光进行不同时间段的光线处理。而天空又是怎么样的呢?人站在一个位置环顾四周,人就是一个球体内的中心点,threejs的摄像机位置就是球体内的中心点,所以Sky模块里面要创建一个球体。

this.skyMesh = new THREE.Mesh(

new THREE.SphereBufferGeometry(1000, 24, 12),

this.skyMaterial

);

当然可以添加天空的材质布置

this.skyMaterial = new THREE.ShaderMaterial({

uniforms: THREE.UniformsUtils.clone(SkyShader.uniforms), fragmentShader: SkyShader.fragmentShader,

vertexShader: SkyShader.vertexShader,

side: THREE.BackSide

});

在一个场景里要有一个阴影的效果,并且从远处看和近处看都不一样

这里首先要对renderer设置开启阴影,类型设置为软阴影,使用库three-csm,设置相机的远平面(距离相机更远时阴影不可见),设置影子的级联数为3,方向光强度为2.5,阴影贴图的分辨率2048,达到逼真的阴影效果。

renderer.shadowMap.enabled = true;

renderer.shadowMap.type = THREE.PCFSoftShadowMap;

this.csm = new CSM({

fov: 80,

far: 250, // maxFar

lightIntensity: 2.5,

cascades: 3,

shadowMapSize: 2048,

camera: world.camera,

parent: world.graphicsWorld,

mode: 'custom',

customSplitsCallback: splitsCallback

});

this.csm.fade = true;

相关推荐
叶智辽9 小时前
【Three.js 与 Shader】编写你的第一个自定义着色器,让模型拥有灵魂
webgl·gpu·three.js
普密斯科技1 天前
精准把控每一处细节——FPGA焊点高度精准检测实施方案
人工智能·深度学习·数码相机·计算机视觉·fpga开发·测量
ffreask1 天前
2 硬件选型指南:如何为openclaw选择最佳小龙虾处理设备
数码相机·ai·编程·技术
Bnews1 天前
动作捕捉技术:机器人科研的精准“眼睛”与NOKOV度量动捕的创新实践
数码相机·机器人
Mountain and sea1 天前
工业机器人视觉系统配置与调试完全指南:从硬件选型到实战应用
数码相机·机器人
3DVisionary1 天前
汽车玻璃曲面偏差难控?蓝光3D扫描仪精准把关整车装配面差
人工智能·数码相机·计算机视觉·热失控·xtdic·xtom·动力电池测试
格林威1 天前
Halcon vs OpenCV 速度对比(表格)
人工智能·数码相机·opencv·机器学习·计算机视觉·视觉检测·halcon
格林威1 天前
工业相机图像高速存储(C#版):先存内存,后批量转存方法,附海康相机实战代码!
开发语言·人工智能·数码相机·计算机视觉·c#·视觉检测·海康相机
qq_283720051 天前
WebGL 基础教程(十):从 0 到 1 吃透 MVP 矩阵,3D 旋转立方体手到擒来
3d·矩阵·webgl
格林威1 天前
工业相机图像高速存储(C++版):先存内存,后批量转存方法,附海康相机实战代码!
开发语言·c++·人工智能·数码相机·计算机视觉·工业相机·堡盟相机