基于数字孪生云渲染推流的API调试平台的制作方法

技术领域

本发明涉及数字孪生云渲染技术领域，具体为基于数字孪生云渲染推流的API调试平台的制作方法。

背景技术

数字孪生云渲染项目制作通常需要客户端制作人员与前端制作人员进行同步开发，在客户端方制作好场景效果后交给前端人员指定的调用方法，在前端人员在项目中添加对应方法的代码并编译运行才能查看到对应的效果，该同步协作方式需要前端人员频繁地修改项目代码并重复编译运行进行测试，在前端开发完成前其他人员无法快速查看客户端对应的效果，特别不利于客户端人员进行检查以及测试进行测试。

现有技术中，项目通常采用同步开发方式，该方式需要客户端人员全程参与，整体业务逻辑由客户端人员制作，经由前端调用指定方法调用整体业务，在业务逻辑发生变动时，需要客户端人员重新进行制作修改并打包发布，这会导致项目开发速度缓慢，任何一个小修改都可能占用极大的时间。

发明内容

本发明的目的在于提供基于数字孪生云渲染推流的API调试平台的制作方法，以解决上述背景技术中提出的客户端及测试人员无法快速地查看测试客户端功能的问题。

为实现上述目的，本发明提供如下技术方案：基于数字孪生云渲染推流的API调试平台的制作方法，所述方法包括以下步骤：

在项目开发中引入API调试平台；

平台通过WebRTC协议能快捷地连接客户端视频推流，实现视频流与自定义数据流的通信；

客户端为前端提供多种基础业务逻辑功能组件；

前端调用预制的功能组件，在平台上实时编辑功能代码，直接查看对应功能效果，以此实现业务逻辑处理，实现与客户端的定制功能的异步开发。

优选的，整理客户端API.JS文档，通过前端技术搭建包含API选择、调试代码预览、调试结果显示、场景效果展示4大区域的调试平台网页界面，通过select标签将客户端定制好的API文件引入形成下拉选。

优选的，通过websocket和webrtc协议的推流技术将调试页面和客户端进行联通实现实时通信，做到页面API调用后客户端实时响应并把结果及场景效果返回给前端页面实时显示，通过websocket与客户端相互通信。

优选的，通过前端常规打包方式编译打包前端代码，进行发布。

优选的，使用者打开网页选择API后实时看见运行后的效果及结果。

与现有技术相比，本发明的有益效果是：

本发明提出的基于数字孪生云渲染推流的API调试平台的制作方法，创造异步开发环境，让整体业务逻辑由前端人员控制，让前端无需多次修改代码编译运行即可查看客户端效果，解决客户端及测试人员无法快速地查看测试客户端功能的问题。

附图说明

图1为本发明整理客户端API.JS文档示意图；

图2为本发明调试平台网页界面图；

图3为本发明API文件引入形成下拉选示意图；

图4为本发明整体页面代码示意图；

图5为本发明websocket与客户端相互通信代码示意图；

图6为本发明运行后的效果及结果示意图；

图7为本发明流程图。

具体实施方式

为了使本发明的目的、技术方案进行清楚、完整地描述，及优点更加清楚明白，以下结合附图对本发明实施例进行进一步详细说明。应当理解，此处所描述的具体实施例是本发明一部分实施例，而不是全部的实施例，仅仅用以解释本发明实施例，并不用于限定本发明实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

实施例一

请参阅图7，本发明提供一种技术方案：基于数字孪生云渲染推流的API调试平台的制作方法，所述方法包括以下步骤：

在项目开发中引入API调试平台，平台通过WebRTC协议能快捷地连接客户端视频推流，实现视频流与自定义数据流的通信。客户端为前端提供多种基础业务逻辑功能组件，前端调用预制的功能组件，在平台上实时编辑功能代码，直接查看对应功能效果，以此实现业务逻辑处理，实现与客户端的定制功能的异步开发，平台包含的预制功能包括但不限于：

一、事件监听

二、自定义POI点

添加自定义POI点位

更新自定义POI点的坐标

更新自定义POI点Marker（图标样式）

更新自定义POI点Label（点位文字说明）

更新自定义POI点Effect（特效）

查询一个POI点信息

获取本地保存标签设置

设置本地保存标签

显示/隐藏POI点

显示/隐藏全部POI点

删除POI点

删除全部POI点

聚焦至自定义POI点

聚焦至全部自定义POI点

三、标签聚合

手动刷新聚合

标签聚合修改样式

标签聚合设置

设置自动聚合

四、时间&天气

获取场景当前时间

设置场景时间

获取场景当前天气

设置场景天气

五、工具栏

开启测量工具

结束测量

开启取点工具

获取测量数据

删除坐标点

结束取点

开启坐标点辅助

关闭坐标点辅助

UE鼠标位置地理信息

指南针

设置场景渲染质量

设置场景帧率

场景色彩调节

场景坐标转换至屏幕位置信息

删除场景坐标

删除全部场景坐标

六、场景镜头

获取当前场景镜头信息

设置场景镜头

设置镜头绕场景中心点旋转

场景镜头移动

设置当前场景镜头视界

重置场景初始镜头

七、场景描边高亮

设置场景描边高亮

删除场景描边高亮

八、楼宇拆解

楼宇拆解

还原所有楼宇

九、区域轮廓

添加区域轮廓

更新区域轮廓数据点

更新区域轮廓样式

显示/隐藏区域轮廓

删除区域轮廓

删除全部区域轮廓

聚焦至区域轮廓

聚焦至全部区域轮廓

鼠标事件

十、路径

添加路径

更新路径点位

更新路径样式

显示/隐藏路径

显示/隐藏全部路径

删除路径

发明创造解决其技术问题所采用的技术方案是：在项目开发中引入API调试平台，平台通过WebRTC协议能快捷地连接客户端视频推流，实现视频流与自定义数据流的通信。客户端为前端提供多种基础业务逻辑功能组件，前端调用预制的功能组件，在平台上实时编辑功能代码，直接查看对应功能效果，以此实现业务逻辑处理，实现与客户端的定制功能的异步开发，平台包含的预制功能包括但不限于：

一、事件监听

二、自定义POI点

添加自定义POI点位

更新自定义POI点的坐标

更新自定义POI点Marker（图标样式）

更新自定义POI点Label（点位文字说明）

更新自定义POI点Effect（特效）

查询一个POI点信息

获取本地保存标签设置

设置本地保存标签

显示/隐藏POI点

显示/隐藏全部POI点

删除POI点

删除全部POI点

聚焦至自定义POI点

聚焦至全部自定义POI点

三、标签聚合

手动刷新聚合

标签聚合修改样式

标签聚合设置

设置自动聚合

四、时间&天气

获取场景当前时间

设置场景时间

获取场景当前天气

设置场景天气

五、工具栏

开启测量工具

结束测量

开启取点工具

获取测量数据

删除坐标点

结束取点

开启坐标点辅助

关闭坐标点辅助

UE鼠标位置地理信息

指南针

设置场景渲染质量

设置场景帧率

场景色彩调节

场景坐标转换至屏幕位置信息

删除场景坐标

删除全部场景坐标

六、场景镜头

获取当前场景镜头信息

设置场景镜头

设置镜头绕场景中心点旋转

场景镜头移动

设置当前场景镜头视界

重置场景初始镜头

七、场景描边高亮

设置场景描边高亮

删除场景描边高亮

八、楼宇拆解

楼宇拆解

还原所有楼宇

九、区域轮廓

添加区域轮廓

更新区域轮廓数据点

更新区域轮廓样式

显示/隐藏区域轮廓

删除区域轮廓

删除全部区域轮廓

聚焦至区域轮廓

聚焦至全部区域轮廓

鼠标事件

十、路径

添加路径

更新路径点位

更新路径样式

显示/隐藏路径

显示/隐藏全部路径

删除路径

删除全部路径

聚焦到路径

聚焦到所有路径

鼠标事件

十一、热力图

添加区域热力图

更新区域热力图数据点

更新区域热力图样式

显示/隐藏热力图

显示/隐藏全部热力图

删除区域热力图

删除全部区域热力图

聚焦至区域热力图

聚焦至全部区域热力图

鼠标事件

十二、可视域

添加可视域

更新可视域样式

更新可视域数据点

显示/隐藏可视域

显示/隐藏全部可视域

删除可视域

删除全部可视域

聚焦至可视域

聚焦至全部可视域

鼠标事件

十三、高亮区域

添加高亮区域

更新高亮区域数据点

更新高亮区域样式

删除高亮区域

聚焦至高亮区域

十四、迁徙图

添加迁徙图

更新迁徙图数据点

更新迁徙图样式

显示/隐藏迁徙图

显示/隐藏全部迁徙图

删除迁徙图

删除全部迁徙图

聚焦至迁徙图

聚焦至全部迁徙图

鼠标事件

十五、战略图

添加战略图

更新战略图数据点

更新战略图样式

播放战略图动画

显示/隐藏战略图

显示/隐藏全部战略图

删除战略图

删除全部战略图

聚焦至战略图

聚焦至全部战略图

鼠标事件

十六、场景特效

添加场景特效

更新场景特效数据点

更新场景特效样式

显示/隐藏场景特效

显示/隐藏全部场景特效

删除场景特效

删除全部场景特效

聚焦至场景特效

聚焦至全部场景特效

鼠标事件

十七、路径热力图

添加路径热力图

更新区域轮廓数据点

更新区域轮廓样式

显示/隐藏区域轮廓

显示/隐藏全部区域轮廓

删除区域轮廓

删除全部区域轮廓

聚焦至区域轮廓

聚焦至全部区域轮廓

鼠标事件

十八、柱状热力图

添加柱状热力图

更新柱状热力图数据点

更新柱状热力图样式

显示/隐藏热力图

显示/隐藏全部热力图

删除柱状热力图

删除全部柱状热力图

聚焦至柱状热力图

聚焦至全部柱状热力图

鼠标事件

十九、清除所有覆盖物。

实施例二

在实施例一的基础上，参照附图1至图6，具体操作流程如下：

整理客户端API.JS文档（图1）。

二、通过html、Css、JavaScript等前端技术搭建包含API选择、调试代码预览、调试结果显示、场景效果展示4大区域的调试平台网页界面（图2）。通过select标签将客户端定制好的API文件引入形成下拉选。如（图3）整体页面代码如（图4）

三、通过websocket和webrtc协议的推流技术将调试页面和客户端进行联通实现实时通信，做到页面API调用后客户端实时响应并把结果及场景效果返回给前端页面实时显示，如下代码（图5）通过websocket与客户端相互通信。

四、通过前端常规打包方式如vue+webpack编译打包前端代码，进行发布。

五、使用者打开网页选择API后实时看见运行后的效果及结果（图6）。

尽管已经示出和描述了本发明的实施例，对于本领域的普通技术人员而言，可以理解在不脱离本发明的原理和精神的情况下可以对这些实施例进行多种变化、修改、替换和变型，本发明的范围由所附权利要求及其等同物限定。