资源展示方法、装置、设备及存储介质与流程

1.本发明涉及数据显示技术领域，尤其涉及一种资源展示方法、装置、设备及存储介质。


背景技术：

2.现阶段，一般会使用图片和视频来展示各种资源。
3.但是，通过这种方法很难直观展示出待展示资源的细节特征，进而难以全面的呈现出完整的资源信息。


技术实现要素：

4.本发明的主要目的在于提供一种资源展示方法、装置、设备及存储介质，旨在解决现有技术中难以全面的呈现出完整的资源信息的技术问题。
5.根据本发明的第一方面，提供了一种资源展示方法，所述方法包括：
6.获取用户上传至目标网页的多个目标资源图像数据；
7.根据多个所述目标资源图像数据，生成目标资源的三维模型数据；
8.基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据。
9.可选地，所述获取用户上传至目标网页的多个目标资源图像数据之前，所述方法还包括：
10.搭建用户界面框架；
11.基于所述用户界面框架，生成所述目标网页。
12.可选地，所述根据多个所述目标资源图像数据，生成目标资源的三维模型数据，包括：
13.根据多个所述目标资源图像数据，确定对应的多个目标资源；
14.查询多个所述目标资源的多组资源信息；
15.根据多组所述资源信息，确定多个所述目标资源的模型参数，生成所述三维模型数据。
16.可选地，所述基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据之前，所述方法还包括：
17.接收用户导入的外部模型；
18.所述基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据，包括：
19.根据所述三维模型数据，生成对应的三维模型；
20.将所述三维模型和所述外部模型添加至所述目标网页中，以使所述目标网页展示所述三维模型。
21.可选地，所述目标网页包括多个展示区域，多个所述展示区域用于展示多个所述
目标资源的三维模型数据，所述基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据之后，所述方法还包括：
22.若接收到用户输入的区域跳转请求，则根据所述区域跳转请求确定对应的目标展示区域，并将所述目标网页跳转至所述目标展示区域进行显示。
23.可选地，所述若接收到用户输入的区域跳转请求，则根据所述区域跳转请求确定对应的目标展示区域，并将所述目标网页跳转至所述目标展示区域进行显示之后，所述方法还包括：
24.若接收到用户输入的角度调整请求，则根据所述角度调整请求，调整展示角度；
25.根据调整后的展示角度显示所述目标展示区域。
26.可选地，所述目标网页配置有vr展示模式，所述方法还包括：
27.若接收到用户输入的vr展示请求，则向所述目标网页发出vr展示指令，以使所述目标网页切换至所述vr展示模式展示所述三维模型数据。
28.根据本发明的第二方面，提供了一种资源展示装置，所述装置包括：
29.数据获取模块，用于获取用户上传至目标网页的多个目标资源图像数据；
30.数据处理模块，用于根据多个所述目标资源图像数据，生成目标资源的三维模型数据；
31.数据展示模块，用于基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据。
32.根据本发明的第三方面，提供了一种资源展示设备，包括：存储器、处理器及存储在所述存储器上并可在所述处理器上运行的资源展示程序，所述资源展示程序被所述处理器执行时实现第一方面的实现方式中的任一种可能的实现方式中所述的各个步骤。
33.根据本发明的第四方面，提供了一种计算机可读存储介质，其上存储有资源展示程序，所述资源展示程序被处理器执行时实现第一方面的实现方式中的任一种可能的实现方式中所述的各个步骤。
34.本发明实施例提出一种资源展示方法、装置、设备及存储介质，通过资源展示设备获取用户上传至目标网页的多个目标资源图像数据；根据多个所述目标资源图像数据，生成目标资源的三维模型数据；基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据。
35.本发明基于待展示资源的数据信息，在网页上建立对应的三维模型，通过三维模型对待展示资源进行立体呈现。本发明区别于现有技术中难以全面的呈现出完整的资源信息的情况，将资源数据转化为三维模型数据并显示在网页上，利用三维模型对待展示的资源和数据进行三维显示，从而实现了在网页上直观展示资源信息。
附图说明
36.为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据提供的附图获得其他的附图。
37.图1为本发明实施例方案涉及的硬件运行环境的资源展示设备的结构示意图；
38.图2为本发明资源展示方法的第一实施例的流程示意图；
39.图3为本发明图2中s202的步骤的细化流程示意图；
40.图4为本发明图2中s203的步骤的细化流程示意图；
41.图5为本发明图2中s203的步骤之后的流程示意图；
42.图6为本发明资源展示方法的第二实施例的流程示意图；
43.图7为本发明实施例涉及的资源展示装置的功能模块示意图。
44.本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。
具体实施方式
45.应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。
46.本发明实施例的主要解决方案是：获取用户上传至目标网页的多个目标资源图像数据；根据多个所述目标资源图像数据，生成目标资源的三维模型数据；基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据。
47.现阶段，一般会使用图片和视频来展示各种资源。但是，通过这种方法很难直观展示出待展示资源的细节特征，进而难以全面的呈现出完整的资源信息。
48.本发明提供一种解决方案，该方案用于资源展示设备，基于待展示资源的数据信息，在网页上建立对应的三维模型，通过三维模型对待展示资源进行立体呈现。本发明区别于现有技术中难以全面的呈现出完整的资源信息的情况，将资源数据转化为三维模型数据并显示在网页上，利用三维模型对待展示的资源和数据进行三维显示，从而实现了在网页上直观展示资源信息。
49.为使本发明实施例的目的、技术方案和优点更加清楚，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分的实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
50.本发明实施例的说明书和权利要求书中的“第一”、“第二”用于区别类似的对象，而不必用于描述特定的顺序或者先后次序，应该理解这样的数据在适当的情况下可以互换，以便这里描述的实施例能够以除了这里图示或者描述的那些以外的顺序实施。
51.参照图1，图1为本发明实施例方案涉及的硬件运行环境的资源展示设备的结构示意图。
52.如图1所示，该资源展示设备可以包括：处理器1001，例如中央处理器(central processing unit，cpu)，通信总线1002、用户接口1003，网络接口1004，存储器1005。其中，通信总线1002用于实现这些组件之间的连接通信。用户接口1003可以包括显示屏(display)、输入单元比如键盘(keyboard)，可选用户接口1003还可以包括标准的有线接口、无线接口。网络接口1004可选的可以包括标准的有线接口、无线接口(如无线保真(wireless-fidelity，wi-fi)接口)。存储器1005可以是高速的随机存取存储器(random access memory，ram)，也可以是稳定的非易失性存储器(non-volatile memory，nvm)，例如磁盘存储器。存储器1005可选的还可以是独立于前述处理器1001的存储装置。
53.本领域技术人员可以理解，图1中示出的结构并不构成对资源展示设备的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。
54.如图1所示，作为一种存储介质的存储器1005中可以包括操作系统、数据获取模块、数据处理模块、数据展示模块以及资源展示程序。
55.在图1所示的资源展示设备中，网络接口1004主要用于与网络服务器进行数据通信；用户接口1003主要用于与用户进行数据交互；本发明资源展示设备中的处理器1001、存储器1005可以设置在资源展示设备中，资源展示设备通过处理器1001调用存储器1005中存储的资源展示程序，并执行本发明实施例提供的资源展示方法。
56.基于上述硬件结构但不限于上述硬件结构，本发明提供一种资源展示方法第一实施例。参照图2，图2为本发明资源展示方法第一实施例的流程示意图。
57.本实施例中，该方法包括：
58.步骤s201，获取用户上传至目标网页的多个目标资源图像数据；
59.在本实施例中，执行主体为资源展示设备，该资源展示设备与用于显示的网页界面连接，通过网页界面可以实时接收用户上传的资源图像数据。具体的，用户可将待展示资源的一张或多张图像上传至用于展示的目标网页，可以理解的，在某一角度下，一些资源可能因为被其他资源遮挡，或是展示角度有限等原因导致不能反应出来，故用户可以上传多张不同角度的图像，以实现更全面的资源展示，上传的图像越多、涉及的角度越丰富，则最后展示的效果也越好，越全面。比如对于一个待展示的仓库资源，一张图像往往难以展示出其全貌，故用户可以从多个不同的角度拍摄仓库的不同区域，利用多角度、多区域的图像数据来完成后续步骤。
60.需要补充说明的是，在执行上述步骤之前，首先需要搭建出一个网页。具体的，首先利用vue技术搭建出一个用户界面框架，然后对该用户界面框架进行相应配置和封装，最终得到该目标网页。
61.步骤s202，根据多个所述目标资源图像数据，生成目标资源的三维模型数据；
62.为了将上述得到的图像数据进行直观展示，可以将这些图像数据转换为对应的三维数据，从而对这些图像数据进行立体展示。
63.在一具体实施方式中，参照图3，图3为本发明图2中s202的步骤的细化流程示意图，所述根据多个所述目标资源图像数据，生成目标资源的三维模型数据，包括：
64.步骤a10，根据多个所述目标资源图像数据，确定对应的多个目标资源；
65.如上所述，上述得到的多个目标资源图像数据为对应的多个待展示资源，即目标资源的图像，故可以从中确定出待展示的目标资源，在本实施例中，目标资源可以为一些具体的物体如桌子、箱子等。一种可行的方式为：通过扫描组件对所得图像进行扫描，基于扫描结果，利用图像识别技术识别出其中包含的具体物体，即目标资源。
66.步骤a20，查询多个所述目标资源的多组资源信息；
67.在得到上述目标资源后，可以从后端数据库中查询与这些目标资源对应的资源信息，可以理解的，资源信息可以包含资源名称，资源的规格、数量、排布等各项相关数据。
68.步骤a30，根据多组所述资源信息，确定多个所述目标资源的模型参数，生成所述三维模型数据。
69.如上所述，可以从资源信息中得到对应资源的规格、数量、排布等各项相关数据，故可据此得到对应的模型参数。比如对于仓库中的一个货箱，可以对应的数据信息中得到其长宽高分别为a、b、c，即可将其模型参数对应设置为长为a、宽为b以及高为c，当然为了后
续建模方便，也可根据实际情况按比例对其放大或缩小。除此之外，还可以根据实际需求获得其材料、装载情况等信息，并对应设置模型参数；最后整合这些参数信息即可得到对应的三维模型数据。
70.步骤s203，基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据。
71.在得到上述三维模型数据后，即可据此建立对应的三维模型，然后将这些三维模型在目标网页上进行显示，从而立体的展现出目标资源，进而实现更加直观的展示。需要补充说明的是，在接收到上述多个目标资源图像数据时，会首先利用canvas技术对接收到的多张图像进行整合，并生成一个初始的三维展示空间显示在目标网页上，后续只需要基于该三维模型数据更新目标网页中的初始三维展示空间即可。
72.另外，除了基于上述三维模型数据更新目标网页之外，参照图4步骤s401，还可以接收用户导入的外部模型来共同完成。可以理解的，在实际应用中，可能会涉及到一些比较复杂的物体，这时仅靠对应的数据信息来生成三维模型数据并完成后续的建模是比较困难的，可能会花费较长的处理时间甚至无法完成相应处理，故对于一些复杂的物体，可以预先建立对应的外部模型，在需要使用时，仅需直接导入即可，从而提升处理效率。
73.在一具体实施方式中，参照图4，图4为本发明图2中s203的步骤的细化流程示意图，所述基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据，包括：
74.步骤b10，根据所述三维模型数据，生成对应的三维模型；
75.如上所述，得到了三维模型数据后，由于三维模型数据中包含了长宽高等三维信息，因此即可据此建立对应的三维模型，可以理解的，该三维模型可以真实反应实际物体的各项数据和属性。
76.步骤b20，将所述三维模型和所述外部模型添加至所述目标网页中，以使所述目标网页展示所述三维模型。
77.不难理解，对于一个实际的场景，其中可能包含多个资源即多个物体，故为了更真实的进行资源展示，需要按照真实的摆放方式来进行模型的添加。具体的，首先，可以先确定出待展示资源的实际摆放数据，然后据此确定各个待展示资源的实际摆放方式，最后按照该实际摆放方式将所有待展示资源添加至目标网页中。一种可行的方式为：实际摆放数据中包含了每个待展示资源的编号以及对应的坐标，然后即可将每个待展示资源按照对应的坐标添加至目标网页中。
78.在本实施例中，基于用户上传的资源图像和外部模型，对待展示的资源进行三维建模，并根据实际情况对所建的三维模型进行排布，可以更真实更直观的展示各种资源。
79.进一步地，作为一个实施例，参照图5，图5为本发明图2中s203的步骤之后的流程示意图，所述基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据之后，所述方法还包括：
80.步骤s501，若接收到用户输入的区域跳转请求，则根据所述区域跳转请求确定对应的目标展示区域，并将所述目标网页跳转至所述目标展示区域进行显示；
81.在完成上述步骤后，对应的三维场景即可在目标网页上显示。可以理解的，在实际应用中一个三维场景可能很大，在有限的界面上难以完整清晰的展示出来，故为了方便查
看，本实施例中可将其划分为多个展示区域。比如对于一个仓库，其可以分为入库区、出库区、库存区、售后区等等，即可据此将其划分为不同的区域。
82.之后，用户可以根据实际需求输入区域跳转请求，以使目标网页切换至目标展示区域进行显示。具体的，可以根据多个不同展示区域，在目标网页上设置区域切换菜单和区域切换按钮，用户首先点击区域切换菜单，目标网页上即对应显示各个区域的区域切换按钮，然后用户再点击某一区域如a区域对应的按钮，用户交互界面即可切换至a区域进行显示；除此之外，如果用户点击的按钮对应于当前显示的区域，则可显示提示信息，比如“已为您显示该区域场景”。
83.步骤s502，若接收到用户输入的角度调整请求，则根据所述角度调整请求，调整展示角度；
84.步骤s503，根据调整后的展示角度显示所述目标展示区域。
85.在上述可根据区域跳转请求跳转至指定区域进行查看的基础上，对于任一展示区域，还可以根据用户需求调整展示角度。具体的，对于每个展示区域，会首先定义一个摄像头位置和角度，该角度即为初始的默认角度，在跳转至某一展示区域后，会默认以此初始角度进行展示。而用户可以通过长按并拖动鼠标，来实现展示角度的变化，比如用户向左拖动鼠标，则展示角度相应的向左移动，相应的，显示的视角也向左移动；可以理解的向右也是如此，在此不再赘述。
86.本实施例中，可以根据用户的需求随时跳转至任一展示区域，还能随时调整展示角度，方便用户查看任一区域的任一位置，从而满足用户的各种实际需要。
87.进一步地，作为一个实施例，参照图6，图6为本发明资源展示方法第二实施例的流程示意图。
88.本实施例中，该方法还包括：
89.步骤s601，若接收到用户输入的vr展示请求，则向所述目标网页发出vr展示指令，以使所述目标网页切换至所述vr展示模式展示所述三维模型数据。
90.为了进一步提高用户体验，上述目标网页还配置有对应的vr展示模式。用户可将vr设备如vr眼镜等接入资源展示设备，然后佩戴vr设备，再点击目标网页上的vr展示按钮，即可进入vr展示模式进行查看。一方面，用户可通过左右转头实现展示视角的变化；另一方面，用户还可对上述定义的摄像头进行设置，设置一个旋转速度和旋转方式，比如顺时针旋转或逆时针旋转，然后开启vr展示，此时无需用户自己移动即可实现场景的自动旋转展示，进一步提高了用户体验。
91.本实施例中，采用vr技术为用户提供了更真实的场景展示，并且还可以通过自动旋转设置为用户提供旋转展示功能，使用户可以从任何角度观察场景，从而进一步保证了资源信息的直观展示。
92.基于同一发明构思，本发明实施例还提供一种资源展示装置，参照图7所示，包括：
93.数据获取模块，用于获取用户上传至目标网页的多个目标资源图像数据；
94.数据处理模块，用于根据多个所述目标资源图像数据，生成目标资源的三维模型数据；
95.数据展示模块，用于基于所述三维模型数据，更新所述目标网页，以在所述目标网页展示所述三维模型数据。
96.作为一种可选的实施例，资源展示装置还可包括：
97.界面搭建模块，用于搭建用户界面框架。
98.作为一种可选的实施例，资源展示装置还可包括：
99.网页生成模块，用于基于所述用户界面框架，生成所述目标网页。
100.作为一种可选的实施例，资源展示装置还可包括：
101.vr展示模块，用于若接收到用户输入的vr展示请求，则向所述目标网页发出vr展示指令，以使所述目标网页切换至所述vr展示模式展示所述三维模型数据。
102.此外，在一实施例中，本技术还提供一种计算机存储介质，所述计算机存储介质上存储有计算机程序，所述计算机程序被处理器运行时实现前述方法实施例中方法的步骤。
103.在一些实施例中，计算机可读存储介质可以是fram、rom、prom、eprom、eeprom、闪存、磁表面存储器、光盘、或cd-rom等存储器；也可以是包括上述存储器之一或任意组合的各种设备。计算机可以是包括智能终端和服务器在内的各种计算设备。
104.在一些实施例中，可执行指令可以采用程序、软件、软件模块、脚本或代码的形式，按任意形式的编程语言(包括编译或解释语言，或者声明性或过程性语言)来编写，并且其可按任意形式部署，包括被部署为独立的程序或者被部署为模块、组件、子例程或者适合在计算环境中使用的其它单元。
105.作为示例，可执行指令可以但不一定对应于文件系统中的文件，可被存储在保存其它程序或数据的文件的一部分，例如，存储在超文本标记语言(html，hyper text markup language)文档中的一个或多个脚本中，存储在专用于所讨论的程序的单个文件中，或者，存储在多个协同文件(例如，存储一个或多个模块、子程序或代码部分的文件)中。
106.作为示例，可执行指令可被部署为在一个计算设备上执行，或者在位于一个地点的多个计算设备上执行，又或者，在分布在多个地点且通过通信网络互连的多个计算设备上执行。
107.以上仅为本发明的优选实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。