web数据三维展示方法及装置制造方法及图纸

技术编号:18940565 阅读:73 留言:0更新日期:2018-09-15 11:04
本申请公开了一种web数据三维展示方法及装置,使用本申请提供的方法,用户仅需要输入所要展示的web图形对应的web图形数据即可,由web数据3D展示装置自动对输入的数据进行解析、格式转换等处理,将数据转换为WEBGL接口所能识别的格式,从而实现利用WEBGL接口对web数据进行三维展示的目的。简化了数据三维展示的操作流程,使得数据三维展示速度更快、效率更高。

Three dimensional display method and device for Web Data

This application discloses a web data three-dimensional display method and device. Using the method provided in this application, users only need to input the web graphics data corresponding to the web graphics they want to display. The web data three-dimensional display device automatically parses the input data and converts the data into the WEBGL interface. The format of recognition is used to realize the three-dimensional display of Web data using WEBGL interface. It simplifies the operation process of data 3D display, and makes the 3D display faster and more efficient.

【技术实现步骤摘要】
web数据三维展示方法及装置
本申请涉及三维展示
,更具体地说,涉及一种web数据三维展示方法及装置。
技术介绍
目前互联网上数据的展示主要是图表,图像等二维数据,通过WEBGL技术可以使数据展示三维化,从而有更逼真和人性化的展示效果。WEBGL是web的三维绘图标准,支持OPENGL的硬件渲染,目前在各个平台都已经得到很好地支持。但是由于WEBGL发展还不是很完善,本身的接口对数据三维可视化操作很复杂。为了构建一个三维场景,用户不仅需要有一定的计算机图形学基础,还需要编写很繁杂的代码,以实现向WEBGL接口提供其所能够识别处理的图形数据,这样才可以调用WEBGL接口实现web数据的三维可视化展示。显然,现有调用WEBGL接口实现web数据三维展示的方案过于复杂。现有技术需要等待用户编写代码,对图形数据进行处理后才能够实现三维展示,其图形数据的三维展示效率低。
技术实现思路
有鉴于此,本申请提供了一种web数据3D展示方法及装置,以解决现有图形数据三维展示效率低的问题。为了实现上述目的,现提出的方案如下:一种web数据三维展示方法,包括:获取与所要展示的web图形对应的web图形数据;确定组成获取的web图形数据的各三维坐标点的边界,得到边界数据;根据获取的web图形数据,确定格式转换后的目标格式的web图形数据,所述目标格式的web图形数据为WEB图形库WEBGL接口所能识别的与获取的web图形的样式对应格式的web图形数据;调用所述WEBGL接口,根据所述边界数据设置画布大小,并利用目标格式的web图形数据在画布上进行所述web图形的三维展示。一种web数据三维展示装置,包括:图形数据获取单元,用于获取与所要展示的web图形对应的web图形数据;边界数据确定单元,用于确定组成获取的web图形数据的各三维坐标点的边界,得到边界数据;格式转换单元,用于根据获取的web图形数据,确定格式转换后的目标格式的web图形数据,所述目标格式的web图形数据为WEB图形库WEBGL接口所能识别的与获取的web图形的样式对应格式的web图形数据;三维展示单元,用于调用所述WEBGL接口,根据所述边界数据设置画布大小,并利用目标格式的web图形数据在画布上进行所述web图形的三维展示。本申请实施例提供的web数据三维展示方法,获取与所要展示的web图形对应的web图形数据;确定组成获取的web图形数据的各三维坐标点的边界,得到边界数据;根据获取的web图形数据,确定格式转换后的目标格式的web图形数据,目标格式的web图形数据为WEB图形库WEBGL接口所能识别的与获取的web图形的样式对应格式的web图形数据;调用所述WEBGL接口,根据所述边界数据设置画布大小,并利用目标格式的web图形数据在画布上进行所述web图形的三维展示。由此可见,使用本申请提供的方法,用户仅需要输入所要展示的web图形对应的web图形数据即可,由web数据三维展示装置自动对输入的数据进行解析、格式转换等处理,将数据转换为WEBGL接口所能识别的格式,从而实现利用WEBGL接口对web数据进行三维展示的目的。简化了数据三维展示的操作流程,使得数据三维展示速度更快、效率更高。附图说明为了更清楚地说明本申请实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据提供的附图获得其他的附图。图1a-1c分别示例了三种不同样式的三维展示图;图2为本申请实施例公开的一种web数据三维展示方法流程图;图3为本申请实施例公开的另一种web数据三维展示方法流程图;图4为本申请实施例公开的又一种web数据三维展示方法流程图;图5为本申请实施例公开的一种web数据三维展示装置结构示意图;图6为本申请实施例提供的一种终端硬件结构示意图。具体实施方式下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。本申请实施例公开了一种web数据三维展示方案,其可以应用于安装有浏览器的终端设备,如智能手机、IPAD、电脑等。这里,终端设备安装的浏览器需要支持WEBGL,从而能够调用WEBGL接口实现数据三维展示。本申请提供的web数据三维展示方案可以适用于图表展示、趋势走向、区域覆盖等图的展示,参照图1a-1c,示例了三种不同样式的三维展示图。其中,图1a示例的是点图,以离散点的形式显示在空间中,用户输入三维的坐标点即可。此类型的图表可以多层次展示数据的离散性,有利于直观展示数据在空间中的离散性等,适用于城市热力图等应用。图1b示例的是线图,点与点之间通过线段连接。用户除了输入三维的坐标点之外,还需要输入点之间的连接关系。此类型的图表可以在三维空间中展示数据的某个线性趋势或者关系,适用于趋势图之类的应用。图1c示例的是面图,由三角形构成的三维空间中显示的区域图。用户需要输入构成整个三维曲面的每个三角形的顶点坐标。此类型的图表可以构建复杂的场景,如城市地图、物品模型等,适用于复杂图标的展现。接下来的实施例中,对本申请的web数据三维展示方法进行详细介绍,参见图2所示,该方法包括:步骤S100、获取与所要展示的web图形对应的web图形数据;具体地,用户在进行web图形展示时,需要确定web图形对应的web图形数据,根据web图形的样式不同,用户输入的web图形数据格式也不完全相同。如点样式的web图形对应的web图形数据为坐标点格式数据,线样式的web图形对应的web图形数据为线格式数据,面样式的web图形对应的web图形数据为面格式数据。根据上述图1a-1c对应文字介绍可知,无论是点格式、线格式和面格式的web图形数据,均由坐标点组成。当web图形的样式为点时,本步骤中获取至少一坐标点组成的坐标点集合。该坐标点集合作为web图形数据。坐标点的输入可以表示为(x,y,z),其中,x,y,z可以为浮点数据类型。当web图形的样式为线时,本步骤中获取至少两个坐标点组成的坐标点集合,以及,获取至少一个线索引组成的线索引集合,其中,每一线索引指示所述坐标点集合中,确定一条线的两个坐标点的索引值。其中,坐标点集合中每一坐标点的形式可以参照上述介绍。需要说明的是,坐标点集合中各坐标点存在索引值,索引值可以是坐标点在坐标点集合中的排序顺序,或者是坐标点集合中各元素的下标。可以理解的是,为了确定一条线,需要至少两个坐标点,因此在获取坐标点集合的基础上,还需要获取线索引集合,线索引集合中每一线索引指示了坐标点集合中,确定一条线的两个坐标点的索引值。如索引(0,1)表示坐标点集合中第1个点和第2个点进行连线(注意:这里坐标点集合中坐标点的索引值从0开始计数)。当web图形的样式为面时,本步骤获取至少一个三角形元素组成的三角形元素集合,每一所述三角形元素包括用于确定三角形的三个坐标点。其中,面状web图形都是由若干三角形组成,因此本步骤本文档来自技高网...

【技术保护点】
1.一种web数据三维展示方法,其特征在于,包括:获取与所要展示的web图形对应的web图形数据;确定组成获取的web图形数据的各三维坐标点的边界,得到边界数据;根据获取的web图形数据,确定格式转换后的目标格式的web图形数据,所述目标格式的web图形数据为WEB图形库WEBGL接口所能识别的与获取的web图形的样式对应格式的web图形数据;调用所述WEBGL接口,根据所述边界数据设置画布大小,并利用目标格式的web图形数据在画布上进行所述web图形的三维展示。

【技术特征摘要】
1.一种web数据三维展示方法,其特征在于,包括:获取与所要展示的web图形对应的web图形数据;确定组成获取的web图形数据的各三维坐标点的边界,得到边界数据;根据获取的web图形数据,确定格式转换后的目标格式的web图形数据,所述目标格式的web图形数据为WEB图形库WEBGL接口所能识别的与获取的web图形的样式对应格式的web图形数据;调用所述WEBGL接口,根据所述边界数据设置画布大小,并利用目标格式的web图形数据在画布上进行所述web图形的三维展示。2.根据权利要求1所述的方法,其特征在于,在所述确定组成获取的web图形数据的各三维坐标点的边界之前,该方法还包括:对获取的web图形数据进行合法性校验,并在确定合法性校验通过后执行所述确定组成获取的web图形数据的各三维坐标点的边界的操作。3.根据权利要求1或2所述的方法,其特征在于,所述根据获取的web图形数据,确定格式转换后的目标格式的web图形数据,包括:根据所述边界数据,确定是否需要对所述web图形进行调整;若是,根据获取的web图形数据,确定调整后的web图形对应的目标web图形数据,所述调整后的web图形与设定观察点间的位置关系满足预设位置关系;将所述目标web图形数据的格式转换为目标格式,得到目标格式的web图形数据。4.根据权利要求3所述的方法,其特征在于,所述预设位置关系包括预设距离关系和预设视角关系;所述根据所述边界数据,确定是否需要对所述web图形进行调整,包括:根据所述边界数据,确定所述web图形的边界与设定观察点间的距离是否满足预设距离关系;根据所述边界数据,确定所述web图形的边界与设定观察点间的视角是否满足预设视角关系;若确定至少不满足所述预设距离关系和所述预设视角关系中的一个,则确定需要对所述web图形进行调整。5.根据权利要求1所述的方法,其特征在于,所要展示的web图形的样式为点;所述获取与所要展示的web图形对应的web图形数据,包括:获取至少一坐标点组成的坐标点集合。6.根据权利要求1所述的方法,其特征在于,所要展示的web图形的样式为线;所述获取与所要展示的web图形对应的web图形数据,包括:获取至少两个坐标点组成的坐标点集合;以及,获取至少一个线索引组成的线索引集合,每一线索引指示所述坐标点集合中,确定一条线的两个坐标点的索引值。7.根据权利要求1所述的方法,其特征在于,所要展示的web图形的样式为面;所述获取与所要展示的web图形对应的web图形数据,包括:获取至少一个三角形元素组成的三角形元素集合,每一所述三角形元素包括用于确定三角形的三个坐标点。8.根据权利要求1所述的方法,其特征在于,所述确定组成获取的web图形数据的各三维坐标点的边界,得到边界数据,包括:根据组成获取的web图形数据的各三维坐标点,确定第一维度方向、第二维度方向和第三维度方向上的最大值和最小值,由所述第一维度方向、第二维度方向和第三维度方向上的最大值和最小值组成边界数据。9.一种web数据三维...

【专利技术属性】
技术研发人员:钱春海
申请(专利权)人:腾讯科技深圳有限公司
类型:发明
国别省市:广东,44

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1