CN110490979B - 一种Web环境下基于深度图的虚实融合装置及方法 - Google Patents

Abstract

本发明公开了一种Web环境下基于深度图的虚实融合装置及方法。本发明涉及计算机图形学领域；本发明对虚实融合流程进行重构，采用前后端协同绘制架构，平衡前后端的计算能力，减轻了网络带宽压力，基于绘制模板；客户端无需GPU即可进行虚实融合，极大地提高了绘制效率，降低了客户端硬件配置要求；在客户端采用JS进行无插件式绘制，避免了浏览器与插件不兼容的问题，提高了效率与兼容性。

Description

一种Web环境下基于深度图的虚实融合装置及方法

技术领域

本发明涉及计算机图形学领域，尤其涉及一种Web环境下的虚实融合装置及方法。

背景技术

目前，虚实融合是典型的数据和计算密集应用，需要较高的硬件支持。在Web环境下，现有虚实融合技术有三种：基于插件、基于远程绘制和基于WebGL的方式。

基于插件的方式能充分发挥客户端的计算能力，但在Web环境下，廉价客户端普遍存在，难以满足所需的软硬件配置。此外由于需要下载和安装插件，客户体验差，存在安全性风险，跨平台性也差。

基于远程绘制的虚实融合方法，视频在服务端接入，在服务端融合后再以视频流方式推送到客户端，传输量很大。由于绝大部分工作均在服务端处理，客户端的计算能力基本没发挥，服务端容易成为性能瓶颈，难以应对多路视频接入和多用户并发访问。

目前兴起的基于WebGL的虚实融合方法属于无插件式方法，能平衡服务器和客户端的计算能力，用户体验好，但由于需要传输三维场景数据，以及WebGL本身的效率问题，只适合于小场景。

网络带宽受限、廉价客户端和多用户并发访问是Web应用需要面对的现实问题，针对Web环境的上述特点，如何平衡服务端和客户端的计算能力，减少网络数据传输量和提高融合效率是面向Web的虚实融合方法需要解决的关键问题。

发明内容

本发明的目的在于提供一种Web环境下基于深度图的虚实融合装置及方法。

本发明的技术方案是：一种Web环境下基于深度图的虚实融合装置，包括客户端和服务端，所述客户端用于提交请求和接收服务端返回的信息进行自主绘制，所述服务端用于接收客户端请求，生成客户端自主绘制需要的一系列信息并返回给客户端；

所述客户端和服务端相互间用于交互信息：所述客户端向服务端传输的信息包括主视点、视点操作类型及摄像头名称；所述服务端向客户端传输的信息包括主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图及主视点背景图；

其中，所述主视点包括位置、朝向和向上方向三个矢量，所述主视点背景图和摄像头深度图采用压缩或非压缩格式，所述摄像头深度图根据客户端请求摄像头数量，为0个或多个；

其操作方法具体包括以下步骤，其中，服务端按需绘制：

1)、客户端请求参数分析：接受客户端用户请求，获取主视点、视点操作类型和摄像头名称的信息，然后根据获取的主视点重置三维引擎的主视点；根据获取的视点操作类型修改三维引擎的主视点；

2)、生成主视点背景图：生成主视点下的背景图；

3)、生成主视点深度图：生成主视点下的深度图；

4)、生成摄像头深度图：根据摄像头名称查询摄像头信息，获得摄像头视点信息，把主视点切换到摄像头视点，生成摄像头深度图；

5)、把主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图和主视点背景图返回给请求的客户端；

客户端自主绘制：

1)、获取服务端传来的主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图和主视点背景图；

2)、根据主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图，计算主视点背景图各像素在摄像头空间的深度值和视频纹理坐标；

3)、根据步骤2)中计算的深度值，与摄像头深度图中对应像素的深度值进行比较，确定在视频覆盖范围内的主视点背景图像素，若深度值相等，则该像素在视频覆盖范围内，用二维数组记录视频覆盖范围内的像素的视频纹理坐标，生成绘制模板；

4)、视频帧融合：对绘制模板中确定的视频覆盖范围内的所有像素，用该像素的视频纹理坐标采样视频帧作为该像素颜色，不在覆盖区的像素直接使用主视点背景图像素颜色。

本发明的有益效果是：本发明对虚实融合流程进行重构，采用前后端协同绘制架构，平衡前后端的计算能力，减轻了网络带宽压力；基于绘制模板，客户端无需GPU即可进行虚实融合，极大地提高了绘制效率，降低了客户端硬件配置要求；在客户端采用JS进行无插件式绘制，避免了浏览器与插件不兼容的问题，提高了效率与兼容性。

附图说明

图1是本发明的技术路线图；

图2是本发明中主视点的视域模型图；

图3是本发明中摄像头的视域示意图；

图4是本发明中主视点和摄像头视域融合图；

图5是本发明中纹理坐标计算步骤的结构示意图。

具体实施方式

本发明如图所述；包括客户端和服务端，所述客户端用于提交请求和接收服务端返回的信息进行自主绘制，所述服务端用于接收客户端请求，生成客户端自主绘制需要的一系列信息并返回给客户端；

所述客户端和服务端相互间用于交互信息：所述客户端向服务端传输的信息包括主视点、视点操作类型及摄像头名称；所述服务端向客户端传输的信息包括主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图及主视点背景图；

其中，所述主视点包括位置、朝向和向上方向三个矢量，所述主视点背景图和摄像头深度图采用压缩或非压缩格式，所述摄像头深度图根据客户端请求摄像头数量，为0个或多个；

其操作方法具体包括以下步骤，

其中，服务端按需绘制：

1)、客户端请求参数分析：接受客户端用户请求，获取主视点、视点操作类型和摄像头名称的信息，然后根据获取的主视点重置三维引擎的主视点，根据获取的视点操作类型修改三维引擎的主视点；

2)、生成主视点背景图：根据主视点的视域(见图2)，生成主视点的背景图，并把主视点的背景图各个像素的RGB值以无符号整数形式存储；

3)、生成主视点深度图：开启深度测试，根据主视点的视域(见图2)，生成主视点的深度图；

4)、生成摄像头深度图：根据摄像头名称查询摄像头信息，获得摄像头视点信息，把主视点切换到摄像头视点，开启深度测试，根据摄像头的视域(见图3)，生成摄像头深度图；

5)、把主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图、主视点背景图返回给请求的客户端；

客户端自主绘制：

1)、获取服务器传来的主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图、主视点背景图；

2)、根据主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、主视点背景图，计算主视点背景图各像素在摄像头空间的深度值和视频纹理坐标(图5)：将屏幕空间中的像素坐标变换到世界坐标系，通过视图变换变换到摄像头观察坐标系，再通过摄像头投影矩阵变换到齐次裁剪坐标系，最后通过归一化和视口变换得到纹理坐标。

3)、根据步骤2)中计算的深度值，与摄像头深度图中对应像素的深度值进行比较，确定在视频覆盖范围内的主视点背景图像素，若深度值相等，则该像素在视频覆盖范围内；用二维数组记录视频覆盖范围内的像素的视频纹理坐标，生成绘制模板；如图4中，a2-b2弧面，深度值比较结果为大于，即使用模型本身纹理；a1-b2弧面，深度值比较结果为等于，即得到了绘制模板；

4)、视频帧融合：对绘制模板中确定的视频覆盖范围内的所有像素，用该像素的视频纹理坐标采样视频帧作为该像素颜色，不在覆盖区的像素直接使用主视点背景图像素颜色；在canvas标签中绘制融合之后的图。

本发明对虚实融合流程进行重构，采用前后端协同绘制架构，平衡前后端的计算能力，减轻了网络带宽压力，基于绘制模板，客户端无需GPU即可进行虚实融合，极大地提高了绘制效率，降低了客户端硬件配置要求；其次，在客户端采用JS进行无插件式绘制，避免了浏览器与插件不兼容的问题，提高了效率与兼容性。

Claims (1)

1.一种Web环境下基于深度图的虚实融合装置，其特征在于，包括客户端和服务端，所述客户端用于提交请求和接收服务端返回的信息进行自主绘制，所述服务端用于接收客户端请求，生成客户端自主绘制需要的一系列信息并返回给客户端；

所述客户端和服务端相互间用于交互信息：所述客户端向服务端传输的信息包括主视点、视点操作类型及摄像头名称；所述服务端向客户端传输的信息包括主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图及主视点背景图；

其中，所述主视点包括位置、朝向和向上方向三个矢量，所述主视点背景图和摄像头深度图采用压缩或非压缩格式，所述摄像头深度图根据客户端请求摄像头数量，为0个或多个；

其操作方法的具体步骤如下：

其中，服务端按需绘制：

1)、客户端请求参数分析：接受客户端用户请求，获取主视点、视点操作类型和摄像头名称的信息，然后根据获取的主视点重置三维引擎的主视点；根据获取的视点操作类型修改三维引擎的主视点；

2)、生成主视点背景图：生成主视点下的背景图；

3)、生成主视点深度图：生成主视点下的深度图；

4)、生成摄像头深度图：根据摄像头名称查询摄像头信息，获得摄像头视点信息，把主视点切换到摄像头视点，生成摄像头深度图；

5)、把主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图和主视点背景图返回给请求的客户端；

客户端自主绘制：

1)、获取服务端传来的主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图、摄像头深度图和主视点背景图；

2)、根据主视点、主视点投影矩阵、摄像头视图投影矩阵、主视点深度图，计算主视点背景图各像素在摄像头空间的深度值和视频纹理坐标；

3)、根据步骤2)中计算的深度值，与摄像头深度图中对应像素的深度值进行比较，确定在视频覆盖范围内的主视点背景图像素，若深度值相等，则该像素在视频覆盖范围内，用二维数组记录视频覆盖范围内的像素的视频纹理坐标，生成绘制模板；

4)、视频帧融合：对绘制模板中确定的视频覆盖范围内的所有像素，用该像素的视频纹理坐标采样视频帧作为该像素颜色，不在覆盖区的像素直接使用主视点背景图像素颜色。