[发明专利]生成全景图的方法、生成三维页面的方法以及计算设备

说明书

本发明公开了一种生成全景图的方法、生成三维页面的方法以及计算设备。生成全景图的方法在服务端执行，包括：对于一个或多个图片组中的每个图片组，生成对应于该图片组的页面文档，所述页面文档包括背景图片标签和多个图片标签，每个图片标签引用该图片组中的一张目标图片；加载并渲染所述页面文档以生成目标页面，目标图片在所述目标页面中的排列方式基于该图片组所包括的目标图片的数量确定；将所述目标页面转换为图片，得到全景图；将所述全景图存储到第二图片存储器中，并将图片组标识和存储地址相关联的存储到数据存储器中，以便响应于客户端的请求，将与图片组标识对应的全景图返回给客户端，由客户端将全景图渲染为三维页面进行展示。

技术领域

本发明涉及互联网领域，特别涉及一种生成全景图的方法、生成三维页面的方法以及计算设备。

背景技术

随着近几年三维页面(web3d)技术的发展，越来越多的公司采用3d技术来进行宣传。常见的web3d技术有两种，一种是基于全景图的，主要是通过360图片生成；另一种是基于js建模的，主要是利用h5的特性或者使用开源的框架，例如Three.js、PlayCanvas等。

利用全景图生成web3d页面的关键在于如何生成全景图。现有生成全景图的方法通常是基于图片拼接，即采用图片编辑软件，将需要展示的目标图片拼接到背景图片中。该方案的缺点在于：

1)需要使用者熟练使用图片编辑软件；

2)当目标图片数量较大时，需要耗费大量的时间完成图片的拼接；

3)当目标图片发生更新时，需要重新进行拼图；

4)如果要在三维页面上添加目标图片的交互事件，需要知道目标图片的三维位置信息，但是直接根据拼接的全景图来确定目标图片的三维位置信息，在技术上难于实现。

基于js进行建模的原理是，先建模出弧形曲面，再把目标图片作为材质粘贴到曲面上，以实现弯曲的效果。该方案的主要缺点是使用者需要掌握复杂的3d建模知识，建模成本高；当目标图片较多，且图片的顺序不固定的情况下，如何实现动态加载也比较复杂。

发明内容

鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的在方法、装置及计算设备。

根据本发明的一个方面，提供了一种生成全景图的方法，在服务端执行，所述服务端包括第一图片存储器、第二图片存储器和数据存储器，所述第一图片存储器中存储有一个或多个图片组，每个图片组包括多张目标图片，所述方法包括：

对于一个或多个图片组中的每个图片组，生成对应于该图片组的页面文档，所述页面文档包括背景图片标签和多个图片标签，每个图片标签引用该图片组中的一张目标图片；

加载并渲染所述页面文档以生成目标页面，其中，目标图片在所述目标页面中的排列方式基于该图片组所包括的目标图片的数量确定；

将所述目标页面转换为图片，得到全景图；

将所述全景图存储到第二图片存储器中，并将图片组标识和存储地址相关联的存储到数据存储器中，以便响应于客户端的请求，将与图片组标识对应的全景图返回给客户端，由客户端将全景图渲染为三维页面进行展示。

可选地，根据本发明的生成全景图的方法，还包括：将全景图中各目标图片的二维位置信息转换为三维位置信息，所述三维位置信息为目标图片在根据全景图生成的三维页面中的位置信息；将目标图片的图片标识、描述信息与三维位置信息相关联的存储到数据存储器中，以便响应于客户端的请求，将目标图片的描述信息和三维位置信息返回给客户端，由客户端在三维页面中添加对应于目标图片的点击事件，进而在目标图片被点击时，在三维页面中展示对应的描述信息。