CN104318508A - 一种基于面状shp地图图层的数据可视化方法及系统 - Google Patents
一种基于面状shp地图图层的数据可视化方法及系统 Download PDFInfo
- Publication number
- CN104318508A CN104318508A CN201410602649.0A CN201410602649A CN104318508A CN 104318508 A CN104318508 A CN 104318508A CN 201410602649 A CN201410602649 A CN 201410602649A CN 104318508 A CN104318508 A CN 104318508A
- Authority
- CN
- China
- Prior art keywords
- map
- svg
- data
- shp
- planar
- 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.)
- Pending
Links
Landscapes
- Stored Programmes (AREA)
Abstract
本发明涉及一种基于面状shp地图图层的数据可视化方法及系统，所述方法包括：地图数据转换步骤，将面状地图图层的shp格式地图数据转换为适用于Web应用展现的SVG地图数据；SVG地图呈现步骤，通过JavaScript对SVG地图数据进行操作和展示，呈现出SVG地图；数据叠加步骤，对面状地图图层的地理信息进行分析，并将分析结果数据叠加到SVG地图上。本发明在没有GIS引擎的环境下实现的基于地图数据的可视化，利用现有的地图数据，快速地实现在地图上呈现分析数据，将各种分析图形叠加到地图上，以更加美观的方式呈现分析结果。
Description
技术领域
本发明涉及数据分析应用领域，特别是一种基于面状shp地图图层的数据可视化方法及系统。
背景技术
数据分析应用的重要性在各个行业逐渐得到重视，对分析结果的可视化呈现也变得更加重要，数据可视化希望通过极美的形式呈现沉闷繁杂的数据，以更小的时空高效清晰的展示更多数据及信息，让复杂的数据集明了易懂。基于地图的数据可视化是一种常见的手段，这种方式一般通过对地图进行着色、分析图形叠加等方式来呈现与地域相关的数据。基于地图的数据可视化一般有以下几种方式：
1)基于GIS地图；这种方式优点是地图相关的功能灵活，图层配置灵活，但需要有GIS地图支持，并且GIS地图需要具备相关的图层以及接口，所以存在适用面和很多平台依赖方面的问题。
2)基于Flash地图；通过Flash制作地图，将地图数据呈现到对应区块，这种方式实现适用面广，但制作地图成本较高，相关的开发复杂，灵活性差，这种方式在对移动终端支持方面有较大局限性。
发明内容
本发明所要解决的技术问题是提供一种基于面状shp地图图层的数据可视化方法及系统，用于解决基于地图的分析数据的可视化呈现问题。
本发明解决上述技术问题的技术方案如下：一种基于面状shp地图图层的数据可视化方法，包括：
地图数据转换步骤：将面状地图图层的shp格式地图数据转换为适用于Web应用展现的SVG地图数据；
SVG地图呈现步骤：通过JavaScript对SVG地图数据进行操作和展示，呈现出SVG地图；
数据叠加步骤：对面状地图图层的地理信息进行分析，并将分析结果数据叠加到SVG地图上。
在上述技术方案的基础上，本发明还可以做如下改进。
进一步，所述地图数据转换步骤具体包括：
步骤A1,从面状地图图层中动态加载并解析shp格式地图数据；
步骤A2，将shp格式地图数据转换为SVG path路径；
步骤A3，通过SVG path路径进行坐标系的识别和转换，将shp格式地图数据转换为适用于Web应用展现的SVG地图数据。
进一步，所述步骤A3具体包括:解析shp格式地图数据的信息，读取其中的空间特征数据和属性特征数据，将空间特征数据和属性特征数据重写成GML格式文档，然后借助XSLT将GML格式文档转换为SVG格式数据。
进一步，通过JavaScript对SVG地图数据进行操作具体包括：基于SVG地图数据，进行地图场景的放大、缩小、平移、位移和/或点选操作。
进一步，通过JavaScript对SVG地图数据进行操作是以JavaScript监听鼠标滚动、点击和拖拽事件的方式实现的。
进一步，将分析结果数据叠加到SVG地图上时，采用的叠加方式包括着色叠加方式、气泡图叠加方式、饼状图叠加方式、扇形图叠加方式和/或柱状图叠加方式。
本发明的技术方案还包括一种基于面状shp地图图层的数据可视化系统，包括：
地图数据转换模块：用于将面状地图图层的shp格式地图数据转换为适用于Web应用展现的SVG地图数据；
SVG地图呈现模块：用于通过JavaScript对SVG地图数据进行操作和展示，呈现出SVG地图；
数据叠加模块：用于对面状地图图层的地理信息进行分析，并将分析结果数据叠加到SVG地图上。
在上述技术方案的基础上，本发明还可以做如下改进。
进一步，所述地图数据转换模块包括：
加载解析模块,用于从面状地图图层中动态加载并解析shp格式地图数据；
路径生成模块，用于将shp格式地图数据转换为SVG path路径；
SVG地图数据获取模块，用于通过SVG path路径进行坐标系的识别和转换，将shp格式地图数据转换为适用于Web应用展现的SVG地图数据。
本发明的有益效果是：本发明在没有GIS引擎的环境下实现的基于地图数据的可视化，利用现有的地图数据，快速地实现在地图上呈现分析数据，将各种分析图形叠加到地图上，以更加美观的方式呈现分析结果，同时本发明基于标准WEB语言，实现对多浏览、多终端类型的平滑支持。
附图说明
图1为本发明所述的基于面状shp地图图层的数据可视化方法的流程示意图；
图2为本发明实施例中所述地图数据转换步骤的流程示意图；
图3为本发明实施例中所述地图数据转换步骤的流程示意图；
图4为本发明实施例中SVG地图呈现步骤的流程示意图；
图5为本发明所述的基于面状shp地图图层的数据可视化系统的结构示意图。
具体实施方式
以下结合附图对本发明的原理和特征进行描述，所举实例只用于解释本发明，并非用于限定本发明的范围。
如图1所示，本实施例给出一种基于面状shp地图图层的数据可视化方法，包括：
地图数据转换步骤：将面状地图图层的shp格式地图数据转换为适用于Web应用展现的SVG地图数据；
SVG地图呈现步骤：通过JavaScript对SVG地图数据进行操作和展示，呈现出SVG地图；
数据叠加步骤：对面状地图图层的地理信息进行分析，并将分析结果数据叠加到SVG地图上。
如图2所示，所述地图数据转换步骤具体包括：
步骤A1,从面状地图图层中动态加载并解析shp格式地图数据；
步骤A2，将shp格式地图数据转换为SVG path路径；
步骤A3，通过SVG path路径进行坐标系的识别和转换，将shp格式地图数据转换为适用于Web应用展现的SVG地图数据。
即所述所述地图数据转换步骤依次实现了shp格式地图数据的加载和解析、地图转换及SVG地图数据输出。
所述步骤A3中具体包括：解析shp格式地图数据的信息，读取其中的空间特征数据和属性特征数据，将空间特征数据和属性特征数据重写成GML(Geography Markup Language)格式文档，然后借助XSLT将GML格式文档转换为SVG格式数据。GML转换为SVG主要对应关系有:GML中的Point对应svg中circle，GML中LineString对应SVG中polyline，GML中Polygon对应SVG中path。
举例来说，SVG地图数据的格式片段如下，以下SVG地图格式片段分别对应新疆乌鲁木齐(ulmq)、伊利(yili)、哈密(hami)、博州(bozhou)：
ulmq:'M247.707031 128.902344L247.855469 129.011719L248.058594 129.003906L248.277344 128.832031L248.433594 128.683594L248.546875 128.570313L248.621094 128.492188L248.761719128.453125L248.929688 128.492188L249.191406 128.660156L249.40625 128.925781L249.496094 129.109375',
yili:'M129.460938 110.339844L129.667969 110.375L129.816406110.351563L129.929688 110.339844L130.0625 110.304688L130.160156110.285156L130.253906 110.292969L130.355469 110.339844L130.449219 110.363281L130.589844 110.464844L130.683594',
hami:'M314.355469 102.421875L315.351563 102.539063L315.355469 102.539063L315.671875 102.496094L315.703125 102.496094L316.195313 102.445313L316.597656 102.34375L317.277344102.253906L317.492188 102.253906'，
bozhou:'M149.058594 95.554688L149.230469 95.738281L149.386719 96.117188L149.484375 96.222656L149.886719 96.449219L150.007813 96.589844L150.167969 97.300781L150.175781 97.316406'
如图3所示，SVG地图呈现步骤依次实现了SVG地图数据加载、初始数据加载、地图绘制和地图操作，其中通过JavaScript对SVG地图数据进行操作具体包括：基于SVG地图数据，进行地图场景的放大、缩小、平移、位移和/或点选操作。其中，通过JavaScript对SVG地图数据进行操作的实现方式具体为：通过JavaScript实现对SVG的动态控制，监听鼠标滚动、点击、拖拽事件并作出相应的反馈；实现JavaScript按照区域进行地图着色；鼠标滚动实现地图的缩放操作，鼠标的拖拽实现地图的平移操作，鼠标点击实现地图区域的选择操作。
如图4所示，数据叠加步骤主要是依次实现地图加载、数据加载、图形生成和图形叠加，其中将分析结果数据叠加到SVG地图上时，采用的叠加方式包括着色叠加方式、气泡图叠加方式、饼状图叠加方式、扇形图叠加方式和/或柱状图叠加方式。
如图5所示，本实施例还对应给出了一种基于面状shp地图图层的数据可视化系统，包括：
地图数据转换模块：用于将面状地图图层的shp格式地图数据转换为适用于Web应用展现的SVG地图数据；
SVG地图呈现模块：用于通过JavaScript对SVG地图数据进行操作和展示，呈现出SVG地图；
数据叠加模块：用于对面状地图图层的地理信息进行分析，并将分析结果数据叠加到SVG地图上。
其中，所述地图数据转换模块包括：
加载解析模块,用于从面状地图图层中动态加载并解析shp格式地图数据；
路径生成模块，用于将shp格式地图数据转换为SVG path路径；
SVG地图数据获取模块，用于通过SVG path路径进行坐标系的识别和转换，将shp格式地图数据转换为适用于Web应用展现的SVG地图数据。
本实施例的基于面状shp地图图层的数据可视化系统与上述基于面状shp地图图层的数据可视化方法的实施过程相同，这里不再多述。
本实施例通过结合现有GIS地图图层，结合SVG、JS技术在Web展现方面的便利性，将GIS地图格式数据转换为SVG Path格式，并通过JS进行图层控制，将分析结果叠加到SVG地图，实现数据可视化展现形式。
以上所述仅为本发明的较佳实施例，并不用以限制本发明，凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。
Claims (10)
1.一种基于面状shp地图图层的数据可视化方法，其特征在于，包括：
地图数据转换步骤：将面状地图图层的shp格式地图数据转换为适用于Web应用展现的SVG地图数据；
SVG地图呈现步骤：通过JavaScript对SVG地图数据进行操作和展示，呈现出SVG地图；
数据叠加步骤：对面状地图图层的地理信息进行分析，并将分析结果数据叠加到SVG地图上。
2.根据权利要求1所述的一种基于面状shp地图图层的数据可视化方法，其特征在于，所述地图数据转换步骤具体包括：
步骤A1,从面状地图图层中动态加载并解析shp格式地图数据；
步骤A2，将shp格式地图数据转换为SVG path路径；
步骤A3，通过SVG path路径进行坐标系的识别和转换，将shp格式地图数据转换为适用于Web应用展现的SVG地图数据。
3.根据权利要求2所述的一种基于面状shp地图图层的数据可视化方法，其特征在于，所述步骤A3具体包括:解析shp格式地图数据的信息，读取其中的空间特征数据和属性特征数据，将空间特征数据和属性特征数据重写成GML格式文档，然后借助XSLT将GML格式文档转换为SVG格式数据。
4.根据权利要求1所述的一种基于面状shp地图图层的数据可视化方法，其特征在于，通过JavaScript对SVG地图数据进行操作具体包括：基于SVG地图数据，进行地图场景的放大、缩小、平移、位移和/或点选操作。
5.根据权利要求4所述的一种基于面状shp地图图层的数据可视化方法，其特征在于，通过JavaScript对SVG地图数据进行操作是以JavaScript监听鼠标滚动、点击和拖拽事件的方式实现的。
6.根据权利要求1所述的一种基于面状shp地图图层的数据可视化方法，其特征在于，将分析结果数据叠加到SVG地图上时，采用的叠加方式包括着色叠加方式、气泡图叠加方式、饼状图叠加方式、扇形图叠加方式和/或柱状图叠加方式。
7.一种基于面状shp地图图层的数据可视化系统，其特征在于，包括：
地图数据转换模块：用于将面状地图图层的shp格式地图数据转换为适用于Web应用展现的SVG地图数据；
SVG地图呈现模块：用于通过JavaScript对SVG地图数据进行操作和展示，呈现出SVG地图；
数据叠加模块：用于对面状地图图层的地理信息进行分析，并将分析结果数据叠加到SVG地图上。
8.根据权利要求7所述的一种基于面状shp地图图层的数据可视化系统，其特征在于，所述地图数据转换模块包括：
加载解析模块,用于从面状地图图层中动态加载并解析shp格式地图数据；
路径生成模块，用于将shp格式地图数据转换为SVG path路径；
SVG地图数据获取模块，用于通过SVG path路径进行坐标系的识别和转换，将shp格式地图数据转换为适用于Web应用展现的SVG地图数据。
9.根据权利要求7所述的一种基于面状shp地图图层的数据可视化系统，其特征在于，通过JavaScript对SVG地图数据进行操作具体包括：基于SVG地图数据，进行地图场景的放大、缩小、平移、位移和/或点选操作。
10.根据权利要求9所述的一种基于面状shp地图图层的数据可视化系统，其特征在于，通过JavaScript对SVG地图数据进行操作是以JavaScript监听鼠标滚动、点击和拖拽事件的方式实现的。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410602649.0A CN104318508A (zh) | 2014-10-31 | 2014-10-31 | 一种基于面状shp地图图层的数据可视化方法及系统 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410602649.0A CN104318508A (zh) | 2014-10-31 | 2014-10-31 | 一种基于面状shp地图图层的数据可视化方法及系统 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN104318508A true CN104318508A (zh) | 2015-01-28 |
Family
ID=52373734
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201410602649.0A Pending CN104318508A (zh) | 2014-10-31 | 2014-10-31 | 一种基于面状shp地图图层的数据可视化方法及系统 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN104318508A (zh) |
Cited By (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN105279796A (zh) * | 2015-10-10 | 2016-01-27 | 苏州工业园区凌志软件股份有限公司 | 一种3d柱状图的绘制方法及装置 |
| CN106547804A (zh) * | 2015-09-23 | 2017-03-29 | 北京国双科技有限公司 | silverlight 地图的中文名称显示方法及装置 |
| CN106898248A (zh) * | 2017-02-24 | 2017-06-27 | 济南浪潮高新科技投资发展有限公司 | 一种基于FusionMap组件的自定义地图呈现方法 |
| CN107220357A (zh) * | 2017-06-05 | 2017-09-29 | 广东亿迅科技有限公司 | Svg地图数据可视化的实现方法及装置 |
| CN107945249A (zh) * | 2016-10-13 | 2018-04-20 | 北京国双科技有限公司 | 一种气泡图显示方法及装置 |
| CN107977925A (zh) * | 2016-10-24 | 2018-05-01 | 北京国双科技有限公司 | 图形转换方法及装置 |
| CN112097784A (zh) * | 2020-09-01 | 2020-12-18 | 武汉光庭信息技术股份有限公司 | 一种地图传感器地图匹配结果的验证方法及装置 |
| TWI736894B (zh) * | 2018-07-27 | 2021-08-21 | 開曼群島商創新先進技術有限公司 | 地圖資料顯示方法、裝置、電子設備及電腦儲存媒體 |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN1633092A (zh) * | 2004-11-25 | 2005-06-29 | 武汉大学 | 基于移动Agent和GML的分布式GIS空间信息集成装置与方法 |
| US20090125488A1 (en) * | 2007-10-23 | 2009-05-14 | Software Ag | Geographic XML database management system |
| CN101483342A (zh) * | 2008-07-30 | 2009-07-15 | 上海同盛工程建设配套管理有限公司 | 一种用于电力系统的地理信息系统 |
| CN103226604A (zh) * | 2013-04-27 | 2013-07-31 | 上海先之决信息科技发展有限公司 | 基于SVG的WebGIS系统及相应的能耗监控系统 |
-
2014
- 2014-10-31 CN CN201410602649.0A patent/CN104318508A/zh active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN1633092A (zh) * | 2004-11-25 | 2005-06-29 | 武汉大学 | 基于移动Agent和GML的分布式GIS空间信息集成装置与方法 |
| US20090125488A1 (en) * | 2007-10-23 | 2009-05-14 | Software Ag | Geographic XML database management system |
| CN101483342A (zh) * | 2008-07-30 | 2009-07-15 | 上海同盛工程建设配套管理有限公司 | 一种用于电力系统的地理信息系统 |
| CN103226604A (zh) * | 2013-04-27 | 2013-07-31 | 上海先之决信息科技发展有限公司 | 基于SVG的WebGIS系统及相应的能耗监控系统 |
Cited By (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106547804A (zh) * | 2015-09-23 | 2017-03-29 | 北京国双科技有限公司 | silverlight 地图的中文名称显示方法及装置 |
| CN106547804B (zh) * | 2015-09-23 | 2019-10-25 | 北京国双科技有限公司 | silverlight地图的中文名称显示方法及装置 |
| CN105279796A (zh) * | 2015-10-10 | 2016-01-27 | 苏州工业园区凌志软件股份有限公司 | 一种3d柱状图的绘制方法及装置 |
| CN107945249A (zh) * | 2016-10-13 | 2018-04-20 | 北京国双科技有限公司 | 一种气泡图显示方法及装置 |
| CN107977925A (zh) * | 2016-10-24 | 2018-05-01 | 北京国双科技有限公司 | 图形转换方法及装置 |
| CN106898248A (zh) * | 2017-02-24 | 2017-06-27 | 济南浪潮高新科技投资发展有限公司 | 一种基于FusionMap组件的自定义地图呈现方法 |
| CN107220357A (zh) * | 2017-06-05 | 2017-09-29 | 广东亿迅科技有限公司 | Svg地图数据可视化的实现方法及装置 |
| TWI736894B (zh) * | 2018-07-27 | 2021-08-21 | 開曼群島商創新先進技術有限公司 | 地圖資料顯示方法、裝置、電子設備及電腦儲存媒體 |
| CN112097784A (zh) * | 2020-09-01 | 2020-12-18 | 武汉光庭信息技术股份有限公司 | 一种地图传感器地图匹配结果的验证方法及装置 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN104318508A (zh) | 一种基于面状shp地图图层的数据可视化方法及系统 | |
| CN103226453B (zh) | 一种手机屏幕的显示和操作映射到计算机类终端的方法 | |
| Iosifescu-Enescu et al. | Web cartography with open standards–A solution to cartographic challenges of environmental management | |
| CN102426666A (zh) | 基于Away3D引擎的机房运维管理系统及方法 | |
| CN103873277A (zh) | 一种分层的网络拓扑可视化方法及系统 | |
| CN103034502B (zh) | 一种在svg界面中嵌入动态实时监测图表的方法 | |
| CN101763234B (zh) | 一种模拟各种屏幕分辨率的方法及其装置 | |
| CN103631578B (zh) | 一种配电网自动化系统中数据展示方法 | |
| US9785336B2 (en) | Macro-enabled, verbally accessible graphical data visualizations for visually impaired users | |
| CN102937896B (zh) | 在svg中利用颜色映射技术动态展示二维空间数据的方法 | |
| CN103049493B (zh) | 用于确定目标页面元素的呈现位置的方法、装置与设备 | |
| CN112256790A (zh) | 基于WebGL的三维可视化展现系统及数据可视化方法 | |
| CN102722349A (zh) | 一种基于地理信息系统的图像数据处理方法和系统 | |
| CN110766772A (zh) | 基于Flutter跨平台海报制作方法装置介质和设备 | |
| CN105608119A (zh) | 一种专题图快速制图技术 | |
| CN102662921A (zh) | 一种文档处理方法、装置和编辑器 | |
| CN105184836A (zh) | 一种基于qt图形框架的多功能电气接线图显示方法 | |
| Ellul et al. | Investigating approaches to improving rendering performance of 3D city models on mobile devices | |
| CN104090953A (zh) | 一种led灯在虚拟显示终端的地图显示方法及装置 | |
| CN106096121A (zh) | 基于通用地图控件的智能楼宇项目地图绘制方法 | |
| Chen et al. | Data visualization in smart grid and low‐carbon energy systems: A review | |
| CN114675925A (zh) | 组态图像处理方法、装置、计算机设备、存储介质 | |
| CN104461423A (zh) | 一种基于gis的资源信息分布显示方法及装置 | |
| CN104182498A (zh) | Android平台下电子海图引擎及无时延显示方法 | |
| CN103207875A (zh) | 一种地图数据处理方法及装置 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20150128 |
|
| RJ01 | Rejection of invention patent application after publication |