CN104978357A - 一种数据可视化展现方法和装置 - Google Patents
一种数据可视化展现方法和装置 Download PDFInfo
- Publication number
- CN104978357A CN104978357A CN201410143898.8A CN201410143898A CN104978357A CN 104978357 A CN104978357 A CN 104978357A CN 201410143898 A CN201410143898 A CN 201410143898A CN 104978357 A CN104978357 A CN 104978357A
- Authority
- CN
- China
- Prior art keywords
- geographic location
- specified geographic
- destination
- dimensional coordinate
- particle
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Abstract
本申请公开了一种数据可视化展现方法和装置，属于通信计算机技术领域。所述方法包括：在WebGL层中，生成可视化地理底图；将所述指定地理位置的三维数据点的三维坐标转换为二维坐标；获取数据展示信息；根据所述指定地理位置的三维数据点的二维坐标、所述发起地的名称和所述目的地的名称，在画布层中，绘制所述发起地至所述目的地的轨迹线，其中，所述画布层透明覆盖在所述WebGL层上。所述装置包括：生成模块、转换模块、获取模块和绘制模块。本发明通过WebGL和画布联合叠加进行数据可视化展示，使得数据可以形象、有效地展现。
Description
技术领域
本申请涉及通信计算机技术领域，具体涉及一种数据可视化展现方法和装置。
背景技术
随着通信计算机技术的发展，网络的功能也越来越强大，可以通过网络购买物品、订购机票、网上银行服务等，网络数据也越来越多，为了便于用户查看数据，现在常常会通过柱状图、折线图、饼状图等可视化方法展现数据。
然而，柱状图、折线图、饼状图等数据可视化展现方法，是平面形式的可视化，展现方式简单。
发明内容
本申请所要解决的技术问题在于提供一种数据可视化展现方法和装置，通过WebGL和画布联合叠加进行数据可视化展示，使得数据可以形象、有效地展现。
为了解决上述问题，本申请公开了一种数据可视化展现方法，所述方法包括：
在WebGL层中，生成可视化地理底图，其中，所述可视化地理底图中包括指定地理位置的三维数据点；
将所述指定地理位置的三维数据点的三维坐标转换为二维坐标；
获取数据展示信息；其中，所述数据展示信息包括发起地的名称和目的地的名称；
根据所述指定地理位置的三维数据点的二维坐标、所述发起地的名称和所述目的地的名称，在画布层中，绘制所述发起地至所述目的地的轨迹线，其中，所述画布层透明覆盖在所述WebGL层上。
进一步地，在WebGL层中，生成可视化地理底图包括：
获取指定地理地图数据；
从所述指定地理地图数据中，提取得到所述指定地理位置的地理坐标；
根据所述指定地理位置的地理坐标，利用Web墨卡托投影将所述指定地理位置的地理坐标转换为所述三维坐标；
根据所述指定地理地图数据和所述指定地理位置的三维坐标，在所述WebGL层中进行几何化和渲染，生成所述可视化地理底图，其中，所述可视化地理底图中显示与所述指定地理位置的三维坐标对应的三维数据点。
进一步地，将所述指定地理位置的三维数据点的三维坐标转换为二维坐标，包括：
判断所述可视化地理底图是否发生变动；
如果没有发生变动，则判断是否有与所述指定地理位置的三维数据点的三维坐标对应的二维坐标；
如果有，则执行所述获取数据展示信息的步骤。
进一步地，判断是否有与所述指定地理位置的三维数据点的三维坐标对应的二维坐标之后，还包括：
如果没有，则执行将所述指定地理位置的三维数据点的三维坐标转换为二维坐标的步骤。
进一步地，将所述指定地理位置的三维数据点的三维坐标转换为二维坐标，包括：
判断所述可视化地理底图是否发生变动；
如果发生变动，则执行将所述指定地理位置的三维数据点的三维坐标转换为二维坐标的步骤。
进一步地，根据所述指定地理位置的三维数据点的二维坐标、所述发起地的名称和所述目的地的名称，在画布层中，绘制所述发起地至所述目的地的轨迹线，包括：
根据所述发起地和所述目的地的名称，从指定地理地图数据中查询所述发起地和所述目的地的地理坐标，将所述发起地和所述目的地的地理坐标分别转换为所述发起地所述目的地的三维坐标，将所述发起地和所述目的地的三维坐标分别转换为所述发起地和所述目的地的二维坐标，根据所述发起地和所述目的地的二维坐标，生成与所述发起地和所述目的地对应的粒子，并设置所述粒子的形状、所述粒子的大小和所述粒子的运动轨迹；
根据所述指定地理位置的三维数据点的二维坐标、所述发起地和所述目的地的二维坐标，查找与所述发起地对应的指定地理位置、与所述目的地对应的指定地理位置；
在所述画布层中，使所述粒子从与所述发起地对应的指定地理位置开始，按照所述粒子的运动轨迹，移动到与所述目的地对应的指定地理位置。
进一步地，当所述数据展示信息中还包括展示数量时，设置所述粒子的大小包括：
按照预设的粒子大小与展示数量对应关系，设置所述粒子的大小。
进一步地，在所述画布层中，使所述粒子从与所述发起地对应的指定地理位置开始，按照所述粒子的运动轨迹，移动到与所述目的地对应的指定地理位置，包括：
在所述画布层中，从与所述发起地对应的指定地理位置开始，逐帧更新所述粒子在所述粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，当使所述粒子移动到与所述目的地对应的指定地理位置时，使所述粒子消失，其中，所述粒子的运动轨迹为抛物线。
进一步地，与所述发起地对应的指定地理位置的三维数据点通过粒子系统Particle System对象展示，与所述目的地对应的指定地理位置的三维数据点通过所述Particle System对象展示。
为了解决上述问题，本申请还公开了一种数据可视化展现装置，所述装置包括：
生成模块，用于在WebGL层中，生成可视化地理底图，其中，所述可视化地理底图中包括指定地理位置的三维数据点；
转换模块，用于将所述指定地理位置的三维数据点的三维坐标转换为二维坐标；
获取模块，用于获取数据展示信息；其中，所述数据展示信息包括发起地的名称和目的地的名称；
绘制模块，用于根据所述指定地理位置的三维数据点的二维坐标、所述发起地的名称和所述目的地的名称，在画布层中，绘制所述发起地至所述目的地的轨迹线，其中，所述画布层透明覆盖在所述WebGL层上。
进一步地，所述生成模块包括：
获取单元，用于获取指定地理地图数据；
提取单元，用于从所述指定地理地图数据中，提取得到所述指定地理位置的地理坐标；
转换单元，用于根据所述指定地理位置的地理坐标，利用Web墨卡托投影将所述指定地理位置的地理坐标转换为所述三维坐标；
第一生成单元，用于根据所述指定地理地图数据和所述指定地理位置的三维坐标，在所述WebGL层中进行几何化和渲染，生成所述可视化地理底图，其中，所述可视化地理底图中显示与所述指定地理位置的三维坐标对应的三维数据点。
进一步地，所述转换模块包括：
第一判断单元，用于判断所述可视化地理底图是否发生变动；
第二判断单元，用于如果所述第一判断单元的判断结果是没有发生变动，则判断是否有与所述指定地理位置的三维数据点的三维坐标对应的二维坐标；
第一通知单元，用于如果所述第二判断单元的判断结果是有，则通知所述获取模块执行所述获取数据展示信息的步骤。
进一步地，所述转换模块还包括：
第二通知单元，用于如果所述第二判断单元的判断结果是没有，则通知所述转换模块执行将所述指定地理位置的三维数据点的三维坐标转换为二维坐标的步骤。
进一步地，所述转换模块还包括：
第三通知单元，用于如果所述第一判断单元的判断结果是发生变动，则通知所述转换模块执行将所述指定地理位置的三维数据点的三维坐标转换为二维坐标的步骤。
进一步地，所述绘制模块包括：
第二生成单元，用于根据所述发起地和所述目的地的名称，从指定地理地图数据中查询所述发起地和所述目的地的地理坐标，将所述发起地和所述目的地的地理坐标分别转换为所述发起地和所述目的地的三维坐标，将所述发起地和所述目的地的三维坐标分别转换为所述发起地和所述目的地的二维坐标，根据所述发起地和所述目的地的二维坐标，生成与所述发起地和所述目的地对应的粒子，并设置所述粒子的形状、所述粒子的大小和所述粒子的运动轨迹；
查找单元，用于根据所述指定地理位置的三维数据点的二维坐标、所述发起地和所述目的地的二维坐标，查找与所述发起地对应的指定地理位置、与所述目的地对应的指定地理位置；
移动单元，用于在所述画布层中，使所述粒子从与所述发起地对应的指定地理位置开始，按照所述粒子的运动轨迹，移动到与所述目的地对应的指定地理位置。
进一步地，当所述数据展示信息中还包括展示数量时，所述第二生成单元包括：
设置子单元，用于按照预设的粒子大小与展示数量对应关系，设置所述粒子的大小。
进一步地，所述移动单元包括：
移动子单元，用于在所述画布层中，从与所述发起地对应的指定地理位置开始，逐帧更新所述粒子在所述粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，当使所述粒子移动到与所述目的地对应的指定地理位置时，使所述粒子消失，其中，所述粒子的运动轨迹为抛物线。
进一步地，与所述发起地对应的指定地理位置的三维数据点通过粒子系统Particle System对象展示，与所述目的地对应的指定地理位置的三维数据点通过所述Particle System对象展示。
与现有技术相比，本申请可以获得包括以下技术效果：
通过WebGL和画布联合叠加进行数据可视化展示，使得数据可以形象、有效地展现。运动轨迹的形状可以是抛物线，不会在平面上显得过于密集，互相遮挡。将发起地对应的指定地理位置、与目的地对应的指定地理位置通过Particle System对象展示，可以可视化发起地、目的地在地图上的分布。逐帧更新粒子在粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，使得可以形成流星的效果，增加视觉效果。
当然，实施本申请的任一产品必不一定需要同时达到以上所述的所有技术效果。
附图说明
此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：
图1是本申请实施例的第一种数据可视化展现方法流程图；
图2是本申请实施例的第二种数据可视化展现方法流程图；
图3是本申请实施例的第三种数据可视化展现方法流程图；
图4是本申请实施例的第四种数据可视化展现方法流程图；
图5是本申请实施例的一种抛物线示意图；
图6是本申请实施例的一种数据可视化展现装置结构示意图。
具体实施方式
以下将配合附图及实施例来详细说明本申请的实施方式，藉此对本申请如何应用技术手段来解决技术问题并达成技术功效的实现过程能充分理解并据以实施。
在一个典型的配置中，计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。
内存可能包括计算机可读介质中的非永久性存储器，随机存取存储器(RAM)和/或非易失性内存等形式，如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。
计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括非暂存电脑可读媒体(transitory media)，如调制的数据信号和载波。
实施例描述
下面以一实施例对本申请方法的实现作进一步说明。如图1所示，为本申请实施例的一种数据可视化展现方法流程图，该方法包括：
S101：在WebGL层中，生成可视化地理底图。
具体地，WebGL是一种web（网络）端的3D（Dimensions，维度）绘图标准，这种绘图技术标准允许把JavaScript和OpenGL ES2.0结合在一起，通过增加OpenGL ES2.0的一个JavaScript绑定，WebGL可以为HTML5Canvas（画布）提供硬件3D（三维）加速渲染，比传统Canvas性能强约100倍。
其中，可视化地理底图中包括指定地理位置的3D数据点。其中，可视化地理底图可以是世界、国家、地区等的地理底图，指定地理位置可以是国家位置、城市位置、地区位置等。可以根据具体应用情况，选择可视化地理底图的具体范围、指定地理位置的具体内容。如可视化地理底图是中国地理底图、指定地理位置是中国各个城市的位置等。
S102：将指定地理位置的3D数据点的3D坐标转换为2D（二维）坐标。
具体地，指定地理位置的3D数据点在WebGL中的3D坐标，需转化为2d坐标才能进入画布的绘制流程。
S103：获取数据展示信息。
其中，数据展示信息包括发起地的名称和目的地的名称。
具体地，本实施例的方法可以应用在网络购物交易中、银行汇款中、航班中等各个环境中。当本实施例的方法应用在网络购物交易中时，发起地可以是发货地、目的地可以是收货地；当本实施例的方法应用在航班中时，发起地可以是出发地、目的地可以是到达地等。
S104：根据指定地理位置的3D数据点的2D坐标、发起地的名称和目的地的名称，在画布层中，绘制发起地至目的地的轨迹线。
其中，画布层透明覆盖在WebGL层上。
其中，画布层具体可以是processing的画布层，或者Canvas的画布层。Canvas是html5的画布标签，可以通过JavaScript把需要绘制的东西都绘制到Canvas上，和传统的SVG等网页元素比，Canvas具有较高的绘图性能。Canvas绘制抛物线状（流星状）的轨迹线效果比WebGL，可以通过Canvas层将发起地至目的地的轨迹线绘制为抛物线状（流星状）。
具体地，参见图2，在WebGL层中，生成可视化地理底图可以通过下面的方式实现：
S101a：获取指定地理地图数据。
具体地，可以从GeoJSON等数据源获取指定地理地图数据。
其中，指定地理地图数据可以是世界、国家、地区等的地理地图数据，可以根据具体应用情况，选择指定地理地图数据的具体范围。
S101b：从指定地理地图数据中，提取得到指定地理位置的地理坐标。
其中，指定地理位置的地理坐标包括指定地理位置的经度和纬度。
S101c：根据指定地理位置的地理坐标，利用Web（网络）墨卡托投影将指定地理位置的地理坐标转换为3D坐标。
S101d：根据指定地理地图数据和指定地理位置的3D坐标，在WebGL层中进行几何化和渲染，生成可视化地理底图，其中，可视化地理底图中显示有与指定地理位置的3D坐标对应的3D数据点。
其中，在WebGL层中进行几何化和渲染的过程如下：将指定地理位置的3D坐标等转换成WebGL中的几何对象，生成WebGL中的Mesh、Line、Particle System（粒子系统）等对象。在上述过程中，可以将指定地理位置的3D坐标储存在键值为地名的对象中，其中，与发起地对应的指定地理位置、与目的地对应的指定地理位置可以通过Particle System对象展示，用来可视化发起地、目的地在地图上的分布。
具体地，参见图3，将指定地理位置的3D数据点的3D坐标转换为2D坐标，包括：
S102a：判断可视化地理底图是否发生变动，如果没有发生变动，则执行S102b；否则，执行S102c。
具体地，由于可视化地理底图（3d场景）可能存在相机旋转、平移等操作，对可视化地理底图进行判断，看是否是否发生变动，方法为：
将WebGL中当前帧的相机位置（dCameraX，dCameraY，dCameraZ）、角度(rotation.x，rotation.y)、距离物体的距离（distance），分别与上一帧的相机位置、角度、距离物体的距离进行比较，如果上述各项差的绝对值之和小于预设的阈值，则判定可视化地理底图没有发生变动，否则，判定可视化地理底图发生变动。上述各项差的绝对值之和表示如下：
Math.abs(rotation.x-rotationOld.x)+Math.abs(rotation.y-rotationOld.y)+Math.abs(distance-distanceOld)+Math.abs(dCameraZ-dCameraZOld)+Math.abs(dCameraY-dCameraYOld)+Math.abs(dCameraX-dCameraXOld)。
S102b：判断是否有与指定地理位置的3D数据点的3D坐标对应的2D坐标，如果有，则执行S103；否则，执行S102c。
具体地，当判定没有与指定地理位置的3D数据点的3D坐标对应的2D坐标，则证明之前没有执行过将指定地理位置的3D数据点的3D坐标转换为2D坐标，需要执行将指定地理位置的3D数据点的3D坐标转换为2D坐标。当判定有与指定地理位置的3D数据点的3D坐标对应的2D坐标，则证明之前执行过将指定地理位置的3D数据点的3D坐标转换为2D坐标，而当前可视化地理底图没有发生变动，相应地指定地理位置的3D数据点的3D坐标也没有发生变化，则可以直接使用上次的转换结果，不需要再次进行转换，以节约时间。
S102c：将指定地理位置的3D数据点的3D坐标转换为2D坐标，然后执行S103。
具体地，可以利用three.js的投影函数，将指定地理位置的3D数据点的3D坐标转换为2D坐标，如下（下面vectorX和vectorY表示2D坐标）：
var vector=Three.projector.projectVector((country.position).clone(),Three.camera);
var vectorX=(vector.x/2+0.5)*Three.renderer.domElement.width；
var vectorY=(-vector.y/2+0.5)*Three.renderer.domElement.height。
具体地，将指定地理位置的3D数据点的3D坐标转换为2D坐标后，可以将指定地理位置的3D数据点的3D坐标与2D坐标对应存储起来，以便当可视化地理底图没有发生变动时使用。
具体地，参见图4，根据指定地理位置的3D数据点的2D坐标、发起地的名称和目的地的名称，在画布层中，绘制发起地至目的地的轨迹线，包括：
S104a：根据发起地的名称和目的地的名称，从指定地理地图数据中查询发起地的地理坐标和目的地的地理坐标，将发起地的地理坐标和目的地的地理坐标分别转换为发起地的3D坐标和目的地的3D坐标，将发起地的3D坐标和目的地的3D坐标分别转换为发起地的2D坐标和目的地的2D坐标，根据发起地的2D坐标和目的地的2D坐标，生成与发起地和目的地对应的粒子，并设置粒子的形状、粒子的大小、粒子的起点、粒子的终点和粒子的运动轨迹。
其中，粒子的运动轨迹可以是抛物线，粒子逐帧更新位置，参见图5，为使粒子沿着抛物线前进，将抛物线的运动方向分解成起点a到终点b的连线和垂直方向，在ab的连线上，抛物线始终保持匀速运动，设ab的长度为L，粒子每帧运动的距离为dL（通过控制dL的大小，可以保证运动轨迹线视觉效果连续），则粒子运动的总相对时间为T=L/dL，设粒子某一帧的帧数为N，则此时粒子当前运动相对时间占总相对时间的比例t=N/T，此时粒子在抛物线的垂直位置为t*(1-t)*k*L，其中k为与抛物线形状有关的参数，k越大，抛物线越陡峭，可以根据实际应用状况设置k的取值。
其中，粒子的形状可以是星形、圆形等形状，对此不做具体限定。当数据展示信息中还包括展示数量时，按照预设的粒子大小与展示数量对应关系，设置粒子的大小。即可以通过粒子的大小来体现当前展示数量。当本实施例的方法应用在网络购物交易中时，展示数量可以是发货地与收货地之间的交易量等。
S104b：根据指定地理位置的3D数据点的2D坐标、发起地的2D坐标和目的地的2D坐标，查找与发起地对应的指定地理位置、与目的地对应的指定地理位置。
S104c：在画布层中，使粒子从与发起地对应的指定地理位置开始，按照粒子的运动轨迹，移动到与目的地对应的指定地理位置。
其中，在画布层中，使粒子从与发起地对应的指定地理位置开始，按照粒子的运动轨迹，移动到与目的地对应的指定地理位置，包括：
在画布层中，从与发起地对应的指定地理位置开始，逐帧更新粒子在粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，当使粒子移动到与目的地对应的指定地理位置时，使粒子消失，其中，粒子的运动轨迹为抛物线。
具体地，通过上述方法可以形成流星的效果。为了逐次清除当前帧之前的帧的痕迹，可以读取画布的imageData，对imageData数组（imageData数组储存了画布的像素信息，4个为一组，分别表示R（红色）、G（绿色）、B（蓝色）、A（透明度）四个通道）进行间隔为4的遍历，使得每个像素都变为之前的phi倍，phi是一个可调节的参数，可以根据具体显示效果要求，选取phi的取值。
本实施例所述的数据可视化展现方法，通过WebGL和画布联合叠加进行数据可视化展示，使得数据可以形象、有效地展现。运动轨迹的形状可以是抛物线，不会在平面上显得过于密集，互相遮挡。将发起地对应的指定地理位置、与目的地对应的指定地理位置通过Particle System对象展示，可以可视化发起地、目的地在地图上的分布。逐帧更新粒子在粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，使得可以形成流星的效果，增加视觉效果。
如图6所示，是本申请实施例的一种数据可视化展现装置结构图，该装置包括：
生成模块201，用于在WebGL层中，生成可视化地理底图，其中，可视化地理底图中包括指定地理位置的3D数据点；
转换模块202，用于将指定地理位置的3D数据点的3D坐标转换为2D坐标；
获取模块203，用于获取数据展示信息；其中，数据展示信息包括发起地的名称和目的地的名称；
绘制模块204，用于根据指定地理位置的3D数据点的2D坐标、发起地的名称和目的地的名称，在画布层中，绘制发起地至目的地的轨迹线，其中，画布层透明覆盖在WebGL层上。
优选地，生成模块201包括：
获取单元，用于获取指定地理地图数据；
提取单元，用于从指定地理地图数据中，提取得到指定地理位置的地理坐标；
转换单元，用于根据指定地理位置的地理坐标，利用Web墨卡托投影将指定地理位置的地理坐标转换为3D坐标；
第一生成单元，用于根据指定地理地图数据和指定地理位置的3D坐标，在WebGL层中进行几何化和渲染，生成可视化地理底图，其中，可视化地理底图中显示有与指定地理位置的3D坐标对应的3D数据点。
优选地，转换模块202包括：
第一判断单元，用于判断可视化地理底图是否发生变动；
第二判断单元，用于如果第一判断单元的判断结果是没有发生变动，则判断是否有与指定地理位置的3D数据点的3D坐标对应的2D坐标；
第一通知单元，用于如果第二判断单元的判断结果是有，则通知获取模块203执行获取数据展示信息的步骤。
优选地，转换模块202还包括：
第二通知单元，用于如果第二判断单元的判断结果是没有，则通知转换模块202执行将指定地理位置的3D数据点的3D坐标转换为2D坐标的步骤。
优选地，转换模块202还包括：
第三通知单元，用于如果第一判断单元的判断结果是发生变动，则通知转换模块202执行将指定地理位置的3D数据点的3D坐标转换为2D坐标的步骤。
优选地，绘制模块204包括：
第二生成单元，用于根据发起地的名称和目的地的名称，从指定地理地图数据中查询发起地的地理坐标和目的地的地理坐标，将发起地的地理坐标和目的地的地理坐标分别转换为发起地的3D坐标和目的地的3D坐标，将发起地的3D坐标和目的地的3D坐标分别转换为发起地的2D坐标和目的地的2D坐标，根据发起地的2D坐标和目的地的2D坐标，生成与发起地和目的地对应的粒子，并设置粒子的形状、粒子的大小和粒子的运动轨迹；
查找单元，用于根据指定地理位置的3D数据点的2D坐标、发起地的2D坐标和目的地的2D坐标，查找与发起地对应的指定地理位置、与目的地对应的指定地理位置；
移动单元，用于在画布层中，使粒子从与发起地对应的指定地理位置开始，按照粒子的运动轨迹，移动到与目的地对应的指定地理位置。
优选地，当数据展示信息中还包括展示数量时，第二生成单元包括：
设置子单元，用于按照预设的粒子大小与展示数量对应关系，设置粒子的大小。
优选地，移动单元包括：
移动子单元，用于在画布层中，从与发起地对应的指定地理位置开始，逐帧更新粒子在粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，当使粒子移动到与目的地对应的指定地理位置时，使粒子消失，其中，粒子的运动轨迹为抛物线。
优选地，与发起地对应的指定地理位置的3D数据点通过Particle System对象展示，与目的地对应的指定地理位置的3D数据点通过Particle System对象展示。
本实施例所述的数据可视化展现装置，通过WebGL和画布联合叠加进行数据可视化展示，使得数据可以形象、有效地展现。运动轨迹的形状可以是抛物线，不会在平面上显得过于密集，互相遮挡。将发起地对应的指定地理位置、与目的地对应的指定地理位置通过Particle System对象展示，可以可视化发起地、目的地在地图上的分布。逐帧更新粒子在粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，使得可以形成流星的效果，增加视觉效果。
所述装置与前述的方法流程描述对应，不足之处参考上述方法流程的叙述，不再一一赘述。
上述说明示出并描述了本申请的若干优选实施例，但如前所述，应当理解本申请并非局限于本文所披露的形式，不应看作是对其他实施例的排除，而可用于各种其他组合、修改和环境，并能够在本文发明构想范围内，通过上述教导或相关领域的技术或知识进行改动。而本领域人员所进行的改动和变化不脱离本申请的精神和范围，则都应在本申请所附权利要求的保护范围。
Claims (18)
1.一种数据可视化展现方法，其特征在于，所述方法包括：
在WebGL层中，生成可视化地理底图，其中，所述可视化地理底图中包括指定地理位置的三维数据点；
将所述指定地理位置的三维数据点的三维坐标转换为二维坐标；
获取数据展示信息；其中，所述数据展示信息包括发起地的名称和目的地的名称；
根据所述指定地理位置的三维数据点的二维坐标、所述发起地的名称和所述目的地的名称，在画布层中，绘制所述发起地至所述目的地的轨迹线，其中，所述画布层透明覆盖在所述WebGL层上。
2.如权利要求1所述的方法，其特征在于，在WebGL层中，生成可视化地理底图包括：
获取指定地理地图数据；
从所述指定地理地图数据中，提取得到所述指定地理位置的地理坐标；
根据所述指定地理位置的地理坐标，利用Web墨卡托投影将所述指定地理位置的地理坐标转换为所述三维坐标；
根据所述指定地理地图数据和所述指定地理位置的三维坐标，在所述WebGL层中进行几何化和渲染，生成所述可视化地理底图，其中，所述可视化地理底图中显示与所述指定地理位置的三维坐标对应的三维数据点。
3.如权利要求1所述的方法，其特征在于，将所述指定地理位置的三维数据点的三维坐标转换为二维坐标，包括：
判断所述可视化地理底图是否发生变动；
如果没有发生变动，则判断是否有与所述指定地理位置的三维数据点的三维坐标对应的二维坐标；
如果有，则执行所述获取数据展示信息的步骤。
4.如权利要求3所述的方法，其特征在于，判断是否有与所述指定地理位置的三维数据点的三维坐标对应的二维坐标之后，还包括：
如果没有，则执行将所述指定地理位置的三维数据点的三维坐标转换为二维坐标的步骤。
5.如权利要求1所述的方法，其特征在于，将所述指定地理位置的三维数据点的三维坐标转换为二维坐标，包括：
判断所述可视化地理底图是否发生变动；
如果发生变动，则执行将所述指定地理位置的三维数据点的三维坐标转换为二维坐标的步骤。
6.如权利要求1-5任一权利要求所述的方法，其特征在于，根据所述指定地理位置的三维数据点的二维坐标、所述发起地的名称和所述目的地的名称，在画布层中，绘制所述发起地至所述目的地的轨迹线，包括：
根据所述发起地和所述目的地的名称，从指定地理地图数据中查询所述发起地和所述目的地的地理坐标，将所述发起地和所述目的地的地理坐标分别转换为所述发起地和所述目的地的三维坐标，将所述发起地和所述目的地的三维坐标分别转换为所述发起地和所述目的地的二维坐标，根据所述发起地和所述目的地的二维坐标，生成与所述发起地和所述目的地对应的粒子，并设置所述粒子的形状、所述粒子的大小和所述粒子的运动轨迹；
根据所述指定地理位置的三维数据点的二维坐标、所述发起地和所述目的地的二维坐标，查找与所述发起地对应的指定地理位置、与所述目的地对应的指定地理位置；
在所述画布层中，使所述粒子从与所述发起地对应的指定地理位置开始，按照所述粒子的运动轨迹，移动到与所述目的地对应的指定地理位置。
7.如权利要求6所述的方法，其特征在于，当所述数据展示信息中还包括展示数量时，设置所述粒子的大小包括：
按照预设的粒子大小与展示数量对应关系，设置所述粒子的大小。
8.如权利要求6所述的方法，其特征在于，在所述画布层中，使所述粒子从与所述发起地对应的指定地理位置开始，按照所述粒子的运动轨迹，移动到与所述目的地对应的指定地理位置，包括：
在所述画布层中，从与所述发起地对应的指定地理位置开始，逐帧更新所述粒子在所述粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，当使所述粒子移动到与所述目的地对应的指定地理位置时，使所述粒子消失，其中，所述粒子的运动轨迹为抛物线。
9.如权利要求8所述的方法，其特征在于，与所述发起地对应的指定地理位置的三维数据点通过粒子系统Particle System对象展示，与所述目的地对应的指定地理位置的三维数据点通过所述Particle System对象展示。
10.一种数据可视化展现装置，其特征在于，所述装置包括：
生成模块，用于在WebGL层中，生成可视化地理底图，其中，所述可视化地理底图中包括指定地理位置的三维数据点；
转换模块，用于将所述指定地理位置的三维数据点的三维坐标转换为二维坐标；
获取模块，用于获取数据展示信息；其中，所述数据展示信息包括发起地的名称和目的地的名称；
绘制模块，用于根据所述指定地理位置的三维数据点的二维坐标、所述发起地的名称和所述目的地的名称，在画布层中，绘制所述发起地至所述目的地的轨迹线，其中，所述画布层透明覆盖在所述WebGL层上。
11.如权利要求10所述的装置，其特征在于，所述生成模块包括：
获取单元，用于获取指定地理地图数据；
提取单元，用于从所述指定地理地图数据中，提取得到所述指定地理位置的地理坐标；
转换单元，用于根据所述指定地理位置的地理坐标，利用Web墨卡托投影将所述指定地理位置的地理坐标转换为所述三维坐标；
第一生成单元，用于根据所述指定地理地图数据和所述指定地理位置的三维坐标，在所述WebGL层中进行几何化和渲染，生成所述可视化地理底图，其中，所述可视化地理底图中显示与所述指定地理位置的三维坐标对应的三维数据点。
12.如权利要求10所述的装置，其特征在于，所述转换模块包括：
第一判断单元，用于判断所述可视化地理底图是否发生变动；
第二判断单元，用于如果所述第一判断单元的判断结果是没有发生变动，则判断是否有与所述指定地理位置的三维数据点的三维坐标对应的二维坐标；
第一通知单元，用于如果所述第二判断单元的判断结果是有，则通知所述获取模块执行所述获取数据展示信息的步骤。
13.如权利要求12所述的装置，其特征在于，所述转换模块还包括：
第二通知单元，用于如果所述第二判断单元的判断结果是没有，则通知所述转换模块执行将所述指定地理位置的三维数据点的三维坐标转换为二维坐标的步骤。
14.如权利要求12所述的装置，其特征在于，所述转换模块还包括：
第三通知单元，用于如果所述第一判断单元的判断结果是发生变动，则通知所述转换模块执行将所述指定地理位置的三维数据点的三维坐标转换为二维坐标的步骤。
15.如权利要求10-14任一权利要求所述的装置，其特征在于，所述绘制模块包括：
第二生成单元，用于根据所述发起地和所述目的地的名称，从指定地理地图数据中查询所述发起地和所述目的地的地理坐标，将所述发起地和所述目的地的地理坐标分别转换为所述发起地和所述目的地的三维坐标，将所述发起地和所述目的地的三维坐标分别转换为所述发起地和所述目的地的二维坐标，根据所述发起地和所述目的地的二维坐标，生成与所述发起地和所述目的地对应的粒子，并设置所述粒子的形状、所述粒子的大小和所述粒子的运动轨迹；
查找单元，用于根据所述指定地理位置的三维数据点的二维坐标、所述发起地和所述目的地的二维坐标，查找与所述发起地对应的指定地理位置、与所述目的地对应的指定地理位置；
移动单元，用于在所述画布层中，使所述粒子从与所述发起地对应的指定地理位置开始，按照所述粒子的运动轨迹，移动到与所述目的地对应的指定地理位置。
16.如权利要求15所述的装置，其特征在于，当所述数据展示信息中还包括展示数量时，所述第二生成单元包括：
设置子单元，用于按照预设的粒子大小与展示数量对应关系，设置所述粒子的大小。
17.如权利要求15所述的装置，其特征在于，所述移动单元包括：
移动子单元，用于在所述画布层中，从与所述发起地对应的指定地理位置开始，逐帧更新所述粒子在所述粒子的运动轨迹中的位置，并逐次清除当前帧之前的帧的痕迹，当使所述粒子移动到与所述目的地对应的指定地理位置时，使所述粒子消失，其中，所述粒子的运动轨迹为抛物线。
18.如权利要求17所述的装置，其特征在于，与所述发起地对应的指定地理位置的三维数据点通过粒子系统Particle System对象展示，与所述目的地对应的指定地理位置的三维数据点通过所述Particle System对象展示。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410143898.8A CN104978357B (zh) | 2014-04-10 | 2014-04-10 | 一种数据可视化展现方法和装置 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410143898.8A CN104978357B (zh) | 2014-04-10 | 2014-04-10 | 一种数据可视化展现方法和装置 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN104978357A true CN104978357A (zh) | 2015-10-14 |
| CN104978357B CN104978357B (zh) | 2018-08-24 |
Family
ID=54274871
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201410143898.8A Active CN104978357B (zh) | 2014-04-10 | 2014-04-10 | 一种数据可视化展现方法和装置 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN104978357B (zh) |
Cited By (19)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106339430A (zh) * | 2016-08-18 | 2017-01-18 | 合肥大明节能科技股份有限公司 | 基于地图api的海量覆盖物绘制方法 |
| CN106611003A (zh) * | 2015-10-26 | 2017-05-03 | 北京国双科技有限公司 | 数据展现方法及装置 |
| CN106683037A (zh) * | 2015-11-06 | 2017-05-17 | 阿里巴巴集团控股有限公司 | 三维可视化移动轨迹数据的方法和设备 |
| CN106934205A (zh) * | 2015-12-31 | 2017-07-07 | 阿里巴巴集团控股有限公司 | 一种数据关联关系的展示方法及装置 |
| CN107247591A (zh) * | 2017-06-09 | 2017-10-13 | 成都知道创宇信息技术有限公司 | 一种基于地图的大数据展示界面交互方法 |
| CN107832108A (zh) * | 2016-09-14 | 2018-03-23 | 阿里巴巴集团控股有限公司 | 3D canvas网页元素的渲染方法、装置及电子设备 |
| CN107977925A (zh) * | 2016-10-24 | 2018-05-01 | 北京国双科技有限公司 | 图形转换方法及装置 |
| CN108133454A (zh) * | 2016-12-01 | 2018-06-08 | 阿里巴巴集团控股有限公司 | 空间几何模型图像切换方法、装置、系统及交互设备 |
| CN108133506A (zh) * | 2016-12-01 | 2018-06-08 | 阿里巴巴集团控股有限公司 | 实现线条动态效果的方法、装置及系统 |
| CN108230433A (zh) * | 2018-02-07 | 2018-06-29 | 中译语通科技股份有限公司 | 3d地图散点数据展示方法及系统、信息数据处理终端 |
| CN108510567A (zh) * | 2018-04-04 | 2018-09-07 | 北京知道创宇信息技术有限公司 | 业务数据处理方法、装置及可读存储介质 |
| CN108573008A (zh) * | 2017-06-15 | 2018-09-25 | 北京金山云网络技术有限公司 | 一种电子地图中的海量点展示方法及装置 |
| CN109471899A (zh) * | 2018-10-22 | 2019-03-15 | 成都四方伟业软件股份有限公司 | 一种可视化方法、装置及其存储介质 |
| CN110796725A (zh) * | 2019-08-28 | 2020-02-14 | 腾讯科技（深圳）有限公司 | 一种数据渲染方法、装置、终端及存储介质 |
| CN110928510A (zh) * | 2019-11-12 | 2020-03-27 | 北京明略软件系统有限公司 | 显示数据传输过程的方法和装置及计算机可读存储介质 |
| CN111563929A (zh) * | 2020-04-29 | 2020-08-21 | 广州锦行网络科技有限公司 | 一种基于浏览器的2.5d网页开发方法 |
| CN112667902A (zh) * | 2020-12-31 | 2021-04-16 | 上海实迅网络科技有限公司 | 一种基于地理位置的3d信息展示系统 |
| CN114529706A (zh) * | 2022-04-22 | 2022-05-24 | 三一筑工科技股份有限公司 | 三维模型中目标对象的拆分方法、装置、设备及介质 |
| CN117149898A (zh) * | 2023-10-31 | 2023-12-01 | 中科星图测控技术股份有限公司 | 一种混合维度太空态势可视化系统与方法 |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102117500A (zh) * | 2009-12-30 | 2011-07-06 | 新奥特（北京）视频技术有限公司 | 一种三维模型构建方法及系统 |
| CN102722549A (zh) * | 2012-05-28 | 2012-10-10 | 中国科学院遥感应用研究所 | 一种基于集群的遥感数据集实时渲染服务 |
| US20120323992A1 (en) * | 2011-06-20 | 2012-12-20 | International Business Machines Corporation | Geospatial visualization performance improvement for contiguous polylines with similar dynamic characteristics |
| CN102999592A (zh) * | 2012-11-19 | 2013-03-27 | 北京中海新图科技有限公司 | B/S架构下的全球Argo多源海洋数据管理与可视化系统及方法 |
-
2014
- 2014-04-10 CN CN201410143898.8A patent/CN104978357B/zh active Active
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102117500A (zh) * | 2009-12-30 | 2011-07-06 | 新奥特（北京）视频技术有限公司 | 一种三维模型构建方法及系统 |
| US20120323992A1 (en) * | 2011-06-20 | 2012-12-20 | International Business Machines Corporation | Geospatial visualization performance improvement for contiguous polylines with similar dynamic characteristics |
| CN102722549A (zh) * | 2012-05-28 | 2012-10-10 | 中国科学院遥感应用研究所 | 一种基于集群的遥感数据集实时渲染服务 |
| CN102999592A (zh) * | 2012-11-19 | 2013-03-27 | 北京中海新图科技有限公司 | B/S架构下的全球Argo多源海洋数据管理与可视化系统及方法 |
Cited By (26)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106611003A (zh) * | 2015-10-26 | 2017-05-03 | 北京国双科技有限公司 | 数据展现方法及装置 |
| CN106683037A (zh) * | 2015-11-06 | 2017-05-17 | 阿里巴巴集团控股有限公司 | 三维可视化移动轨迹数据的方法和设备 |
| CN106934205A (zh) * | 2015-12-31 | 2017-07-07 | 阿里巴巴集团控股有限公司 | 一种数据关联关系的展示方法及装置 |
| CN106339430B (zh) * | 2016-08-18 | 2019-09-13 | 合肥大明节能科技股份有限公司 | 基于地图api的海量覆盖物绘制方法 |
| CN106339430A (zh) * | 2016-08-18 | 2017-01-18 | 合肥大明节能科技股份有限公司 | 基于地图api的海量覆盖物绘制方法 |
| CN107832108B (zh) * | 2016-09-14 | 2021-05-07 | 阿里巴巴集团控股有限公司 | 3D canvas网页元素的渲染方法、装置及电子设备 |
| CN107832108A (zh) * | 2016-09-14 | 2018-03-23 | 阿里巴巴集团控股有限公司 | 3D canvas网页元素的渲染方法、装置及电子设备 |
| CN107977925A (zh) * | 2016-10-24 | 2018-05-01 | 北京国双科技有限公司 | 图形转换方法及装置 |
| CN108133506A (zh) * | 2016-12-01 | 2018-06-08 | 阿里巴巴集团控股有限公司 | 实现线条动态效果的方法、装置及系统 |
| CN108133454A (zh) * | 2016-12-01 | 2018-06-08 | 阿里巴巴集团控股有限公司 | 空间几何模型图像切换方法、装置、系统及交互设备 |
| CN108133454B (zh) * | 2016-12-01 | 2021-06-08 | 阿里巴巴集团控股有限公司 | 空间几何模型图像切换方法、装置、系统及交互设备 |
| CN107247591A (zh) * | 2017-06-09 | 2017-10-13 | 成都知道创宇信息技术有限公司 | 一种基于地图的大数据展示界面交互方法 |
| CN108573008A (zh) * | 2017-06-15 | 2018-09-25 | 北京金山云网络技术有限公司 | 一种电子地图中的海量点展示方法及装置 |
| CN108573008B (zh) * | 2017-06-15 | 2022-03-04 | 北京金山云网络技术有限公司 | 一种电子地图中的海量点展示方法及装置 |
| CN108230433A (zh) * | 2018-02-07 | 2018-06-29 | 中译语通科技股份有限公司 | 3d地图散点数据展示方法及系统、信息数据处理终端 |
| CN108230433B (zh) * | 2018-02-07 | 2021-07-20 | 中译语通科技股份有限公司 | 3d地图散点数据展示方法及系统、信息数据处理终端 |
| CN108510567A (zh) * | 2018-04-04 | 2018-09-07 | 北京知道创宇信息技术有限公司 | 业务数据处理方法、装置及可读存储介质 |
| CN109471899A (zh) * | 2018-10-22 | 2019-03-15 | 成都四方伟业软件股份有限公司 | 一种可视化方法、装置及其存储介质 |
| CN110796725A (zh) * | 2019-08-28 | 2020-02-14 | 腾讯科技（深圳）有限公司 | 一种数据渲染方法、装置、终端及存储介质 |
| CN110928510A (zh) * | 2019-11-12 | 2020-03-27 | 北京明略软件系统有限公司 | 显示数据传输过程的方法和装置及计算机可读存储介质 |
| CN111563929A (zh) * | 2020-04-29 | 2020-08-21 | 广州锦行网络科技有限公司 | 一种基于浏览器的2.5d网页开发方法 |
| CN112667902A (zh) * | 2020-12-31 | 2021-04-16 | 上海实迅网络科技有限公司 | 一种基于地理位置的3d信息展示系统 |
| CN114529706A (zh) * | 2022-04-22 | 2022-05-24 | 三一筑工科技股份有限公司 | 三维模型中目标对象的拆分方法、装置、设备及介质 |
| CN114529706B (zh) * | 2022-04-22 | 2022-07-08 | 三一筑工科技股份有限公司 | 三维模型中目标对象的拆分方法、装置、设备及介质 |
| CN117149898A (zh) * | 2023-10-31 | 2023-12-01 | 中科星图测控技术股份有限公司 | 一种混合维度太空态势可视化系统与方法 |
| CN117149898B (zh) * | 2023-10-31 | 2024-03-26 | 中科星图测控技术股份有限公司 | 一种基于混合维度太空态势可视化系统的方法 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN104978357B (zh) | 2018-08-24 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN104978357A (zh) | 一种数据可视化展现方法和装置 | |
| Law et al. | Advancement of three-dimensional noise mapping in Hong Kong | |
| KR101546703B1 (ko) | 대용량 건물 bim데이터의 시각화 시스템 | |
| US20230074265A1 (en) | Virtual scenario generation method and apparatus, computer device and storage medium | |
| CN110379010A (zh) | 基于视频融合的三维地理信息可视化方法及系统 | |
| KR101546705B1 (ko) | Bim데이터 처리단말 장치의 건물내부 bim데이터 가시화 방법 | |
| CN104615735A (zh) | 一种基于地理信息空间系统的时空信息可视化方法 | |
| CN102509330A (zh) | 基于电力gis的变电站虚拟三维系统的应用 | |
| CN105279793A (zh) | 一种基于dem真三维地图及绿道的建模方法及系统 | |
| CN108597021B (zh) | 一种地上地下三维模型一体化展示方法及系统 | |
| Gogolla et al. | Towards three-dimensional representation and animation of UML diagrams | |
| CN108765576A (zh) | 基于OsgEarth的VIVE虚拟地球漫游浏览方法 | |
| CN110489897A (zh) | 一种基于bim和gis的三维施工场布vr全景沙盘制作方法 | |
| CN105741340B (zh) | 一种用于网页展示的输电线路三维场景仿真方法和系统 | |
| Jurado et al. | Web-based GIS application for real-time interaction of underground infrastructure through virtual reality | |
| Zahran et al. | 3D visualization of traffic-induced air pollution impacts of urban transport schemes | |
| Rechichi | Chimera: a BIM+ GIS system for cultural heritage | |
| WO2023005934A1 (zh) | 数据处理方法、系统及电子设备 | |
| Liu et al. | A 2d and 3d indoor mapping approach for virtual navigation services | |
| Xu et al. | Efficient visualization of 3D city scenes by integrating the GIS and Unreal Engine | |
| CN104699850B (zh) | 三维地理信息的处理方法及装置 | |
| CN102436677B (zh) | 一种基于深度缓冲地表开挖的三维可视化方法 | |
| CN113204657B (zh) | 一种集成组合式智能展示系统 | |
| Liu et al. | An effective spherical panoramic LoD model for a mobile street view service | |
| Ewald et al. | Appraisal of standards for 3D City Models |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant | ||
| TR01 | Transfer of patent right |
Effective date of registration: 20211115 Address after: Room 507, floor 5, building 3, No. 969, Wenyi West Road, Wuchang Street, Yuhang District, Hangzhou City, Zhejiang Province Patentee after: Zhejiang tmall Technology Co., Ltd Address before: P.O. Box 847, 4th floor, Grand Cayman capital building, British Cayman Islands Patentee before: Alibaba Group Holdings Limited |
|
| TR01 | Transfer of patent right |