一种网页3D场景二维显示方法及系统与流程

本发明涉及数据处理，特别涉及一种网页3d场景二维显示方法及系统。

背景技术：

1、随着科技的进步以及生产力的快速发展，互联网已经在人们的日常生活中得到普及，并且使人们能够在互联网上进行购物、学习以及娱乐，极大的方便了人们的生活。

2、其中，人们大部分通过浏览器访问网页的方式来获取到需要的信息，在访问网页的过程中，可能会出现需要在网页中显示三维场景的情况，从而需要在网页中将三维场景转换成对应的二维画面在网页中进行实时显示。

3、然而，现有技术在网页中将三维场景转换成对应的二维画面的过程中，需要在数据库中编写出大量的转换代码，并需要实时对转换出的二维代码进行解析以及渲染，从而需要消耗较多的运算资源，同时处理效率较低。

技术实现思路

1、基于此，本发明的目的是提供一种网页3d场景二维显示方法及系统，以解决现有技术在网页中将三维场景转换成对应的二维画面的过程中，需要消耗较多的运算资源，导致处理效率较低的问题。

2、本发明实施例第一方面提出了：

3、一种网页3d场景二维显示方法，所述方法包括：

4、实时接收用户输入的ip地址，并将所述ip地址发送至服务器，以获取所述服务器实时下发的与所述ip地址对应的网页资源信息；

5、实时判断所述网页资源信息中是否包含三维场景模型；

6、若实时判断到所述网页资源信息中包含所述三维场景模型，则提取出所述三维场景模型中包含的html文档，并对所述html文档进行解析处理，以生成对应的dom树；

7、检测出所述三维场景模型对应的模型类型，并根据所述模型类型以及所述dom树生成对应的渲染树；

8、通过所述渲染树对所述三维场景模型进行二维渲染，以生成对应的二维画面，并将所述二维画面在网页中进行实时显示。

9、本发明的有益效果是：通过实时接收到的ip地址就能够对应获取到用户需要的网页资源信息，进一步的，当判断到该网页资源信息中存在三维场景模型时，此时能够进一步提取出能够表示当前三维场景模型的html文档，基于此，进一步生成能够进行渲染处理的渲染树，并通过该渲染树对当前三维场景模型进行二维渲染，并能够渲染出对应的二维画面，同时能够进行实时显示，从而能够在不产生大量的数据以及消耗较多的计算资源的前提下，完成三维场景模型的二维渲染，对应提升了渲染效率，同时提升了用户的使用体验。

10、进一步的，所述将所述ip地址发送至服务器，以获取所述服务器实时下发的与所述ip地址对应的网页资源信息的步骤包括：

11、通过所述ip地址向所述服务器发送http请求，所述http请求包含请求类型、请求头部以及请求主体；

12、通过所述服务器根据所述请求类型、所述请求头部以及所述请求主体反馈出对应的响应指令，所述响应指令包含状态码、响应头部以及响应主体；

13、实时根据所述状态码判断所述http请求是否请求成功；

14、若实时根据所述状态码判断到所述http请求已经请求成功，则在所述响应头部中提取出所述网页资源信息。

15、进一步的，所述对所述html文档进行解析处理，以生成对应的dom树的步骤包括：

16、对所述html文档进行全盘扫描，以识别出所述html文档中包含的若干文档节点，每一所述文档节点均具有唯一性；

17、将每一所述文档节点均分别转换成对应的dom元素，并将若干所述dom元素输入至预设dom框架中，以对应生成所述dom树，所述dom树具有唯一性。

18、进一步的，所述通过所述渲染树对所述三维场景模型进行二维渲染，以生成对应的二维画面的步骤包括：

19、调出预设渲染器，并在所述网页中创建出一渲染场景；

20、将所述渲染树输入至所述预设渲染器中，以输出若干对应的渲染节点；

21、将每一所述渲染节点对应添加至每一所述dom元素中，以对每一所述dom元素进行渲染处理并生成若干对应的二维图片；

22、对若干所述二维图片进行拼接处理，以生成所述二维画面，并在所述渲染场景中创建出一二维ui界面，以将所述二维画面在所述二维ui界面中进行实时显示。

23、进一步的，所述在所述渲染场景中创建出一二维ui界面的步骤包括：

24、通过第一预设程序在所述二维ui界面中创建出对应的控制按钮以及滑块，并通过第二预设程序获取所述二维ui界面中的ui元素；

25、建立所述ui元素与所述控制按钮以及所述滑块之间的映射关系，并基于所述映射关系构建出对应的控制器，所述控制器用于控制所述二维ui界面。

26、进一步的，所述检测出所述三维场景模型对应的模型类型的步骤包括：

27、当获取到所述三维场景模型时，识别出所述三维场景模型中包含的模型元素，所述模型元素包含建筑、环境以及人物；

28、逐一计算出所述建筑、所述环境以及所述人物分别在所述三维场景模型中的占比，并根据所述占比确定出所述三维场景模型对应的模型类型。

29、进一步的，所述根据所述模型类型以及所述dom树生成对应的渲染树的步骤包括：

30、根据所述模型类型在预设模型数据库中调用出对应的渲染模型，所述渲染模型包含解析层、融合层以及输出层；

31、将所述模型元素输入至所述解析层中，以使所述解析层输出对应的模型特征；

32、将所述模型特征以及所述dom数同时输入至所述融合层中，以使所述融合层对所述模型特征以及所述dom数进行融合处理并生成所述渲染树；

33、通过所述输出层实时输出所述渲染树，所述渲染树具有唯一性。

34、本发明实施例第二方面提出了：

35、一种网页3d场景二维显示系统，所述系统包括：

36、接收模块，用于实时接收用户输入的ip地址，并将所述ip地址发送至服务器，以获取所述服务器实时下发的与所述ip地址对应的网页资源信息；

37、判断模块，用于实时判断所述网页资源信息中是否包含三维场景模型；

38、解析模块，用于若实时判断到所述网页资源信息中包含所述三维场景模型，则提取出所述三维场景模型中包含的html文档，并对所述html文档进行解析处理，以生成对应的dom树；

39、检测模块，用于检测出所述三维场景模型对应的模型类型，并根据所述模型类型以及所述dom树生成对应的渲染树；

40、渲染模块，用于通过所述渲染树对所述三维场景模型进行二维渲染，以生成对应的二维画面，并将所述二维画面在网页中进行实时显示。

41、进一步的，所述接收模块具体用于：

42、通过所述ip地址向所述服务器发送http请求，所述http请求包含请求类型、请求头部以及请求主体；

43、通过所述服务器根据所述请求类型、所述请求头部以及所述请求主体反馈出对应的响应指令，所述响应指令包含状态码、响应头部以及响应主体；

44、实时根据所述状态码判断所述http请求是否请求成功；

45、若实时根据所述状态码判断到所述http请求已经请求成功，则在所述响应头部中提取出所述网页资源信息。

46、进一步的，所述解析模块具体用于：

47、对所述html文档进行全盘扫描，以识别出所述html文档中包含的若干文档节点，每一所述文档节点均具有唯一性；

48、将每一所述文档节点均分别转换成对应的dom元素，并将若干所述dom元素输入至预设dom框架中，以对应生成所述dom树，所述dom树具有唯一性。

49、进一步的，所述渲染模块具体用于：

50、调出预设渲染器，并在所述网页中创建出一渲染场景；

51、将所述渲染树输入至所述预设渲染器中，以输出若干对应的渲染节点；

52、将每一所述渲染节点对应添加至每一所述dom元素中，以对每一所述dom元素进行渲染处理并生成若干对应的二维图片；

53、对若干所述二维图片进行拼接处理，以生成所述二维画面，并在所述渲染场景中创建出一二维ui界面，以将所述二维画面在所述二维ui界面中进行实时显示。

54、进一步的，所述渲染模块还具体用于：

55、通过第一预设程序在所述二维ui界面中创建出对应的控制按钮以及滑块，并通过第二预设程序获取所述二维ui界面中的ui元素；

56、建立所述ui元素与所述控制按钮以及所述滑块之间的映射关系，并基于所述映射关系构建出对应的控制器，所述控制器用于控制所述二维ui界面。

57、进一步的，所述检测模块具体用于：

58、当获取到所述三维场景模型时，识别出所述三维场景模型中包含的模型元素，所述模型元素包含建筑、环境以及人物；

59、逐一计算出所述建筑、所述环境以及所述人物分别在所述三维场景模型中的占比，并根据所述占比确定出所述三维场景模型对应的模型类型。

60、进一步的，所述检测模块还具体用于：

61、根据所述模型类型在预设模型数据库中调用出对应的渲染模型，所述渲染模型包含解析层、融合层以及输出层；

62、将所述模型元素输入至所述解析层中，以使所述解析层输出对应的模型特征；

63、将所述模型特征以及所述dom数同时输入至所述融合层中，以使所述融合层对所述模型特征以及所述dom数进行融合处理并生成所述渲染树；

64、通过所述输出层实时输出所述渲染树，所述渲染树具有唯一性。

65、本发明实施例第三方面提出了：

66、一种计算机，包括存储器、处理器以及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现如上面所述的网页3d场景二维显示方法。

67、本发明实施例第四方面提出了：

68、一种可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现如上面所述的网页3d场景二维显示方法。

69、本发明的附加方面和优点将在下面的描述中部分给出，部分将从下面的描述中变得明显，或通过本发明的实践了解到。