头图

基于游戏引擎的数字孪生技术方案

一.背景介绍

目前国内的数字孪生在toG方向比较成熟,“数字孪生”是一种应用于建筑科技的新技术,简单说就是利用物理建筑模型,使用各种传感器全方位获取数据的仿真过程,在虚拟空间中完成映射,以反映相对应的实体建筑的全生命周期过程。

二.技术方案实施路线

webgl游戏引擎
技术栈threejs、cesiumue4+webrtc
优点快捷,方便画质材质着色器效果好,比较吃服务器性能
缺点吃用户电脑性能需要大团队配合做建模和场景搭建,繁琐

三.基于游戏引擎所用技术功能模块拆解
hint:以下技术模块路线是比较广泛的一条

  1. 场景搭建
    这里场景搭建可以选择“51、优诺、博能”这些厂商的场景构建工具产品,这些产品都大致囊括了:
    天气切换
    时间切换
    点线面添加
    基础gis分析
    漫游
    视频融合
    osgb、bim、obj等模型控制压平剖切
    数据集成融合
    二三维地图管理
  1. 场景基于webrtc云渲染
这里我所了解的是“平行*”这家厂商,他将ue打包后的exe项目包上传至他们的服务器,再通过他基于webrtc二次封装的通信js包就可以操作云渲染场景。
  1. 前端基于webrtc连接云渲染视频
    xixi (2).gif

    <iframe id="myframe" src="" frameborder="0"></iframe>
    angular框架
    import { Component,OnInit } from '@angular/core';
    import { StorageService } from "../../service/storage.service"
    
    @Component({
      selector: 'app-effect',
      templateUrl: './effect.component.html',
      styleUrls: ['./effect.component.css']
    })
    export class EffectComponent implements OnInit {
      storages: any = {};
      constructor(private storageService:StorageService){
         this.storages = storageService.dataList
      }
      scene:any={};
      ngOnInit():void{
         this.initScene_local()
      }
      titleList: string[] = ['安装UE','安装构建工具','搭建场景','发布部署场景','可视化平台二次开发','通过web进行二次开发','常见问题'];
      initScene_local():void {
           console.log('start');
           this.scene = new window.CloudRenderApi.Scene('myframe', {
                 sceneID: "1073239029270446080", //200
                 server: "http://10.8.35.1:8181", // 云渲染本地服务地址
                 saas: true
           })
           this.scene.on('left_click',(res:any) => {
                 console.log(res);
           })
      }
    }

    四.归纳总结

image.png

此次方案实施下来感受了一下,如果在没有场景构建插件的情况下,整体实施很是繁琐,在接入插件以后场景搭建起来较为方便,但是损失了自由度。结合传统的webgl来看,还是比较倾向于游戏引擎来做数字孪生,毕竟展示效果来说比webgl高了太多。
78 声望
10 粉丝
0 条评论
推荐阅读
数据处理-(车辆、飞机)轨迹点位抽稀处理
需要实现飞机仿真实时移动位置,但是提供的数据量较为庞大,而我们的数据都是通过kafka发送,再由ue4承接数据来做渲染。但是数据量较为庞大,在增大飞行速度的同时渲染比较吃力,于是想到点位个数压缩,数据推送...

友人A1阅读 142

ESlint + Stylelint + VSCode自动格式化代码(2023)
安装插件 ESLint,然后 File -&gt; Preference-&gt; Settings(如果装了中文插件包应该是 文件 -&gt; 选项 -&gt; 设置),搜索 eslint,点击 Edit in setting.json

谭光志34阅读 20.8k评论 9

涨姿势了,有意思的气泡 Loading 效果
今日,群友提问,如何实现这么一个 Loading 效果:这个确实有点意思,但是这是 CSS 能够完成的?没错,这个效果中的核心气泡效果,其实借助 CSS 中的滤镜,能够比较轻松的实现,就是所需的元素可能多点。参考我们...

chokcoco24阅读 2.3k评论 3

你可能不需要JS!CSS实现一个计时器
CSS现在可不仅仅只是改一个颜色这么简单,还可以做很多交互,比如做一个功能齐全的计时器?样式上并不复杂,主要是几个交互的地方数字时钟的变化开始、暂停操作重置操作如何仅使用 CSS 来实现这样的功能呢?一起...

XboxYan25阅读 1.7k评论 1

封面图
在前端使用 JS 进行分类汇总
最近遇到一些同学在问 JS 中进行数据统计的问题。虽然数据统计一般会在数据库中进行,但是后端遇到需要使用程序来进行统计的情况也非常多。.NET 就为了对内存数据和数据库数据进行统一地数据处理,发明了 LINQ (L...

边城17阅读 2k

封面图
【代码鉴赏】简单优雅的JavaScript代码片段(一):异步控制
Promise.race不满足需求,因为如果有一个Promise率先reject,结果Promise也会立即reject;Promise.all也不满足需求,因为它会等待所有Promise,并且要求所有Promise都成功resolve。

csRyan26阅读 3.4k评论 1

「彻底弄懂」this全面解析
当一个函数被调用时,会创建一个活动记录(有时候也称为执行上下文)。这个记录会包含函数在 哪里被调用(调用栈)、函数的调用方法、传入的参数等信息。this就是记录的其中一个属性,会在 函数执行的过程中用到...

wuwhs17阅读 2.4k

封面图
78 声望
10 粉丝
宣传栏