您的位置:首页 > 娱乐 > 八卦 > 【WEB前端2024】开源智体世界:乔布斯3D纪念馆-第26节-内嵌blender展厅

【WEB前端2024】开源智体世界:乔布斯3D纪念馆-第26节-内嵌blender展厅

2024/12/23 6:34:38 来源:https://blog.csdn.net/lauo1188/article/details/139127147  浏览:    关键词:【WEB前端2024】开源智体世界:乔布斯3D纪念馆-第26节-内嵌blender展厅

【WEB前端2024】开源智体世界:乔布斯3D纪念馆-第26节-内嵌blender展厅

使用dtns.network德塔世界(开源的智体世界引擎),策划和设计《乔布斯超大型的开源3D纪念馆》的系列教程。dtns.network是一款主要由JavaScript编写的智体世界引擎(内嵌了three.js编辑器的定制版-支持以第一视角游览3D场馆),可以在浏览器和node.js、deno、electron上运行,它是一个跨平台的软件,支持多个操作系统使用!

下面分为几步介绍,如何基于dtns.network智体世界引擎如何实现乔布斯3D纪念馆的碟状总部嵌入第三方软件定制的3D模型。以非常流行的开源的3D实时渲染软件blender为例,演示如何在超大型3D纪念馆内部,实现blender的展厅模型的嵌入。

通过第三方3D模型的嵌入,可以展示出强大的智体世界引擎的开源、开放、数据和软件资产的融合能力,可以与任意的软件和数据格式实现无缝的融合,从而创造出更多好玩、有趣的软件-数据资产。实现游戏、云展厅、智慧家庭、3D纪念馆等等多种智体应用场景。

第一步:打开头榜页面,找到3D纪念馆xverse轻应用

在这里插入图片描述

第二步:点击右上角…进入头榜编辑器

在这里插入图片描述

第三步:点击正面的“编辑xverse轻应用源码”,进入3D场馆编辑器

在这里插入图片描述

注:通过滚动球控制玩家视角,最终越过出生点(柱),往前移动到空白地带。

第四步:在空白地带停下,点击顶部菜单“文件”导入blender模型文件

在这里插入图片描述

点击导入后,选择gallery.glb(glb是通用的3D模型文件格式,可由blender软件导出3D展厅的模型数据)
在这里插入图片描述

第五步:导入gallery.glb文件,在3D场景编辑器中编辑它

在这里插入图片描述

注:编辑展厅的样式之前,先行点击顶部菜单“视图”-关闭玩家视角

第六步:选择左侧的组件控制器的位置选择器,通过箭头将导入的3D展厅调整至恰当的高度和位置(如下图所示)

在这里插入图片描述

第七步:调整合适的摆放位置之后,效果如下图

在这里插入图片描述

注:乔布斯3D纪念馆的环形通道处,刚才够容纳它。

第八步:再导入碰撞的3D模型文件

9.png

注:collider.glb,保存了一个形如上述的3D展厅的碰撞盒模型,导入它,编辑它,方便设置展厅的碰撞模式。

第九步:将导入的碰撞3D模型的位置坐标,修改为与3D展厅的位置一样

在这里插入图片描述

注:位置一样,但后续会将它设置为不可见,仅用于碰撞检测。

位置调整为一样后,如下图所示(刚好重叠在一起——这个在设计这个3D碰撞模型的时候,可直接基于上述3D展厅做简化的盒子模型)
在这里插入图片描述

第十步:调整面向玩家的第一面碰撞的墙体,拉伸它以便预留安装一个“门”的3D组件的空白位置(玩家可以穿过这个门进入展厅)

在这里插入图片描述

通过左上角的组件控制器,移动它的位置(如下图所示)

在这里插入图片描述

注:通过左上角的组件控制器,进行缩放操作

缩放之后,调整好位置,效果如下图所示

在这里插入图片描述

第十一步:修改碰撞3D模型的碰撞属性为1,将其设置为不可见(隐藏起来看不见,仅用于碰撞检测)

在这里插入图片描述

注:如上图所示,将3D碰撞模型的碰撞属性更新为1,将可见性置为空值,这下子它隐身了。

第十二步:将3D展厅里的壁画的材质组件设置贴图

在这里插入图片描述

上传贴图,效果如下图所示

在这里插入图片描述

第十三步:点击菜单“添加”点光源,将3D展厅的壁画效果显现出现

在这里插入图片描述

添加点光源后,效果如下图所示:

在这里插入图片描述

第十四步:点击顶部菜单“添加”正方体,以便增加一个“门”的3D组件

在这里插入图片描述

第十五步:将“门”3D组件调整至合适大小和适当位置

在这里插入图片描述

注:将门摆放在上述3D碰撞模型的围栏缺口处(刚才预备着放门的位置,如上图所示)——缩放属性为4-5-1(x、y、z轴)

第十六步:将门的颜色设置为艳蓝色

在这里插入图片描述

第十八步:点击顶部菜单“文件”推送头榜(作品),将编辑好的3D展厅以xverse轻应用方式分享给其它用户

在这里插入图片描述

第十九步:将头榜标题修改为3D纪念馆-内嵌blender展厅

在这里插入图片描述

第二十步:返回头榜,找到刚发布的3D纪念馆,点击进入体验3D展厅

在这里插入图片描述

点击xverse-3d应用,进入该3D纪念馆
在这里插入图片描述

通过下部位的滚动球,控制向3D展厅门口前进

前进到门前,直到穿过这个3D门组件

在这里插入图片描述

穿过门之后,我们可以看到3D展厅内部的壁画(如下图所示)

在这里插入图片描述

通过滚动球,控制向右旋转视角看到更多不一样的场景(如下图所示)
在这里插入图片描述

注:并且除了门之外,其它的均不可穿越(3D碰撞模型的碰撞检测属性1已生效)

总结:通过上述20步,我们成功完成了《乔布斯3D纪念馆》的飞碟形态的3D纪念馆嵌入blender展厅。本质上所有的3D模型,只要导出为类似glb等3D标准模型文件,均可在智体3D引擎中进行使用。这大大拓展了与第三方渲染引擎联合设计智体3D应用的能力!亦可为各类3D引擎,随时增添智体节点、智体应用、智体世界引擎的能力。实现dtns.os生态融合发展的目标。

注:dtns.network德塔世界(开源的智体世界引擎)是在github和gitee上开源的项目!

开源地址:

github地址:https://github.com/dtnsman/dtns

Gitee地址:https://github.com/dtnsman/dtns

官方文档:https://dtns.network.yunapi.org

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com