Unity开发数字孪生项目

置顶 @小杨同学.

已于 2025-03-06 13:21:00 修改

阅读量2.6k

点赞数 8

分类专栏： Unity_WebGL 文章标签： unity 游戏引擎 webgl

于 2024-12-09 17:15:16 首次发布

本文链接：https://blog.csdn.net/qq_52159742/article/details/144351745

版权

Unity_WebGL 专栏收录该内容

2 篇文章

订阅专栏

前言：记录下自己用Unity开发数字孪生项目，所用到的知识点、功能点以及对项目认知总结，当然还有开发过程中所遇到的坑。此篇博客也是会随时进行更新。
😊屏幕前看到此片文章的开发者们在此类项目开发过程中少走些弯路，希望对你们有所帮助

1.网页弹窗嵌入Unity-WebGL

经过研究，所以来个自我话术的总结，这两种方式在项目开发中我都用到了，根据需求方便节约开发就使用哪个即可。
在开发过程中，经常会有这样一个需求，在Unity界面上内嵌一个网页，并且可以在界面上把这个网页关掉（不是重新打开新的标签页）实现网页弹窗有两种方式：
1.实现方式，按照博客步骤操作即可
Unity Webgl内嵌网页页面 JavaScrip结合使用
有个小缺点，经测试在全屏模式下，打开内嵌网页无效会卡死，非全屏模式打开关闭弹窗页面下一切正常。
关于unity发布部署本地服务器与Unity交互参考我这篇博客就行
Unity与WebGL的相爱相杀
部署运行效果图如下：
在这里插入图片描述

2.利用3D WebView: the ultimate cross-platform web browser for Unity
官方下载插件资源，WebGL大概119.99刀
CSDN下载插件资源：WebGL Demo
Unity测试使用版本 Unity2020.3.31f1c1
Unity正式开发使用版本 Unity2021.3.6f1c1
编辑器内截图：
在这里插入图片描述

部署运行效果图如下：
![在这里插入图片描述(https://i-blog.csdnimg.cn/direct/5234e9cf4eea4c4288aaea9af08fe58e.png)
编辑器模式下运行效果图：

WebGL 请打包出来运行查看效果，编辑器无法打开网页！

2.URP水资源效果

URP水资源效果：Unity资源商店购买即可
注意商店资源URP打包有问题，打出来Shader效果不对，需联系作者，不知商店是否已经更新到最新版资源；作者修改后私发我的，后打包发布效果没啥问题
在这里插入图片描述

3.播放监控视频

4.数字漫游

5.动态加载AB包资源

问题：URP工程，打出的AssetBundle包在web端加载显示正常，但是在unity端编辑器内材质就显示紫色。
编辑器内运行加载AB包后效果图：
在这里插入图片描述

解决方案：

1.和Windows端的图形API有关

在这里插入图片描述
1.选择Windows端
2.取消勾选Auto Graphics API for Windows
3.在Graphics APIs for Windows中追加OpenGLES3并制定
注意：置顶后会自动重启编辑器，不置顶的添加的OpenGLES3不生效

2.检查AB依赖包是否是没加载成功或没加载完整，尝试检查下加载顺序

3.URP工程内的所需所用Shader是否全部正确添加到项目内

在这里插入图片描述
编辑器内运行加载AB包后效果图：

6.图表插件XCharts

部署运行效果图如下:
在这里插入图片描述
首先是从GitHub官网下载了XChart插件，导入Unity2020.3.31f1c1，发现在编辑器模式下正常运行，但是打包发布就报错，提示系统找不到IL2Cpp文件，我只尝试测试了这一个Unity版本，但我推测其他版本也一样会报这个错误。后面我在我的项目工程内，把XCharts插件删掉后，原先可以打包的WebGL项目也报这个错~
GitHub官网地址

在这里插入图片描述

结论，只要导入了XChart插件后，无论删除与否，打包都会报错。经跟插件作者请教，已经向作者提了这个WebGL打包的问题。暂时还未解决，后面我采取了个折中的方案，如果有朋友导入和我一样的XChart版本后出现了并解决这个错误，欢迎给我留言，虚心学习。
因为目前这个数字孪生项目只涉及到水位图，没有比较复杂的图标信息。Github最新的版本缺少了这个模块，于是我就避免了这个问题，采用了旧的插件版本，项目中所使用的XCharts插件链接
在这里插入图片描述

7.进行WebSocket 通信

8.高亮插件

在这里插入图片描述
下载地址：插件下载🔗
工程内导入截图：

URP使用此插件需注意两点：
1.想高亮的父物体添加Highlight Effect脚本，把其中的Highlighted布尔值开启，剩下参数自己随便乱拉都能看出来效果是干啥的

2.urp后处理这边加下一个组件即可
在这里插入图片描述

9.黑屏过渡

这个功能开发过程中很常见，做的方法有很多，比如Animation动画控制、代码控制Image透明度、Shader控制等等

其中原理就是让一个纯黑的图发生值渐变即可，下边是我常用的方法，利用协同程序代码实现的

方法如下：

    /// <summary>
    /// 值渐变
    /// </summary>
    /// <param name="fStart">起始值</param>
    /// <param name="fEnd">终值</param>
    /// <param name="totalTime">总时间</param>
    /// <param name="acChange">值变化时调用</param>
    /// <param name="acEnd">值渐变完成后调用</param>
    public void ValueChange(float fStart, float fEnd, float totalTime, UnityAction<float> acChange = null, UnityAction acEnd = null)
    {
        StartCoroutine(CValueChange(fStart, fEnd, 0, totalTime, acChange, acEnd));
    }
    private static IEnumerator CValueChange(float fStart, float fEnd, float crtTime, float totalTime, UnityAction<float> acChange, UnityAction acEnd)
    {
        while (crtTime < totalTime)
        {
            acChange?.Invoke(Mathf.Lerp(fStart, fEnd, crtTime / totalTime));
            yield return null;
            crtTime += Time.deltaTime;
        }
        acChange?.Invoke(fEnd);
        acEnd?.Invoke();
    }

具体使用代码如下：

    /// <summary>
    /// 屏幕过渡或者空白遮挡
    /// </summary>
    /// <param name="show">true为黑屏过渡 false为空白遮挡</param>
    public void ShowScreenBlackOrBlockMehtod(bool show, UnityAction action)
    {
        if (show)
        {
            ScreenTransitionBlack.gameObject.SetActive(true);
            ValueChange(0, 1, 1, (f) =>
            {
                color.a = f;
                ScreenTransitionBlack.color = color;
            }, () =>
            {
                action?.Invoke();
            });
        }
        else
        {

        }
    }