CN109726260A - 一种基于离线地图瓦片特定标记添加的方法 - Google Patents
一种基于离线地图瓦片特定标记添加的方法 Download PDFInfo
- Publication number
- CN109726260A CN109726260A CN201811639649.2A CN201811639649A CN109726260A CN 109726260 A CN109726260 A CN 109726260A CN 201811639649 A CN201811639649 A CN 201811639649A CN 109726260 A CN109726260 A CN 109726260A
- Authority
- CN
- China
- Prior art keywords
- map
- file
- tile
- script
- picture
- 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
Landscapes
- Processing Or Creating Images (AREA)
- Instructional Devices (AREA)
Abstract
本发明提供一种基于离线地图瓦片特定标记添加的方法,属于软件‑数据处理技术领域,离线地图通过将日常中经常用到的地图保存成图片并通过软件自带功能进行切片,切片过程中选择切片方案,根据所选方案不同,地图级别,将整个地图切割成不同的瓦片,并重新拼接,使开发人员通过简单的配置本地文件,就可以在离线(即断网)的情况下使用地图。地图瓦片分层切割通过经纬度在地图的特定位置添加相应脚本文件,通过iframe将外部的图表文件、相关界面等引入到地图中来,让地图展示更加全面,美观,更直观的展示企业信息。
Description
技术领域
本发明涉及软件-数据处理技术,尤其涉及一种基于离线地图瓦片特定标记添加的方法。
背景技术
随着互联网技术的不断创新发展,地图展示技术被广泛应用,例如在地图上显示特定的提示信息,图表信息等等,为了提高地图展示的效果,地图瓦片技术开始被使用,同时为了解决开发者在内网离线的使用,让开发者通过简单的配置即可实现通过经纬度在地图瓦片上特定位置添加标记信息及图表信息的功能,设计开发了基于离线地图瓦片添加图标信息等的代码。
瓦片地图金字塔模型是一种多分辨率层次模型,从瓦片金字塔的底层到顶层,分辨率越来越低,但表示的地理范围不变。首先确定地图服务平台所要提供的缩放级别的数量N,把缩放级别最低、地图比例尺最大的地图图片作为金字塔的底层,即第0层,并对其进行分块,从地图图片的左上角开始,从左至右、从上到下进行切割,分割成相同大小(比如256x256像素)的正方形地图瓦片,形成第0层瓦片矩阵;在第0层地图图片的基础上,按每2x2像素合成为一个像素的方法生成第1层地图图片,并对其进行分块,分割成与下一层相同大小的正方形地图瓦片,形成第1层瓦片矩阵;采用同样的方法生成第2层瓦片矩阵;…;如此下去,直到第N一1层,构成整个瓦片金字塔。
传统的地图都是基于网络模式的,也就是说必须在联网的情况下才可以使用。
随着地图技术的应用越来越广泛,越来越多的企业选择在地图中展示自己的企业信息,但是传统地图只能简单的标记地图的位置点,并不能实现在地图的特定位置显示图表信息(柱状图,饼状图,折线图等等)以及企业相关的展示界面。
发明内容
为了解决以上技术问题,本发明提出了一种基于离线地图瓦片特定标记添加的方法,以解决内网离线使用以及添加标记信息功能的问题。
离线地图通过将日常中经常用到的地图保存成图片并通过软件自带功能进行切片,切片过程中选择切片方案,根据所选方案不同,地图级别,将整个地图切割成不同的瓦片,并重新拼接,使开发人员通过简单的配置本地文件,就可以在离线(即断网)的情况下使用地图
地图瓦片分层切割通过经纬度在地图的特定位置添加相应脚本文件,通过iframe将外部的图表文件、相关界面等引入到地图中来,让地图展示更加全面,美观,更直观的展示企业信息;
主要包括如下几个步骤:
1)下载离线文件:
2)将瓦片地址改为本地图片
3)禁用canvas
4)页面引入
5)设置瓦片地图显示区域
6)编写瓦片输出及特定标记代码
7)配置调试
8)瓦片标记代码调整。
进一步的,所述离线文件主要包括:
images文件;
maptile文件。
进一步的,将瓦片地址改为本地图片为了是地图中用到的图片都是本地图片,需要将瓦片地址改为本地图片,修改getmodules,将远程图片改为本地图片./images/,修改apiv.js:将tB:"http://api0.map.bdimg.com/getmodules",修改为:tB:"./js/getmodules",将//0==a.length?e.ny():La(e.Vu.tB+"&mod="+a.join(",")),修改为:0==a.length?e.ny():La(e.Vu.tB),!!!全景图!!!全景图模式必须在服务器环境下才能使用
swfSrc:http://api.map.com/res/swf/APILoader.swf。
进一步的,所述禁用canvas,包括
1)修改相关图片地址:(file:///D:/images/openhand.cur)
2)修改blank.gif地址:
//Sa.src="http://api.map.com/images/blank.gif?"+a.src
Sa.src="./images/blank.gif"
3)IE问题解决:
为了兼容IE9以下的版本,需要在demo里面增加一句:
<meta http-equiv="X-UA-Compatible"content="IE=edge,chrome=1">。
进一步的,引入封装好的地图所用到的js,style样式文件,主要包括:
js文件(apiv、apiv_satellite、apiv_street、AreaRestriction、DrawingManager等)
style文件
map.txt配置文件<script src="js/apiv_street.js"></script><script src="js/AreaRestriction.js"></script><script src="js/DrawingManager_one_rect.js"></script><link href="style/DrawingManager.css"/><!--<link href="bmap.css"/>-->。
进一步的,所述添加瓦片地图的显示区域,设置div块的宽度、高度,边框颜色,粗细,背景,并给div块添加id唯一标识,名称自定义,以便后面脚本调用。
进一步的,所述编写瓦片输出及特定标记代码,主要包括
1)编写瓦片输出脚本,定义变量map并设置卫星图底图,地图文件以本地图片路径为准;
2)创建点坐标,精度和纬度;
3)初始化地图,设置中心的坐标和地图显示级别map.centerAndZoom;
4)设置是否启用滚轮放大缩小(enableScrollWheelZoom);
5)设置是否启用键盘操作(enableKeyboard);
6)设置地图显示的城市,此项是必须设置的setCurrentCity;
7)设置地图放大缩小级别setMinZoom(),setMaxZoom();
8)设置特定标记代码,主要包括:标记显示位置(经纬度)、显示方式、边线颜色(十六进制)、填充颜色(十六进制),边线的宽度(数值),区域透明度(0-1),边线的样式(实线或虚线);
9)在标记区域内增加iframe,并添加要显示的的图表或页面src路径,设置iframe是否显示滚动条,是否显示边框;
10)运行脚本文件。
进一步的,所述配置调试时,如果出现本地地图文件调取失败,返回配置文件检查原因,调整地图配置文件,继续向下执行。
进一步的,所述瓦片标记代码调整时,如果出现界面显示跟自己预想的不一致,返回脚本文件检查原因,调整代码,直到和自己预想的界面一致。
本发明的有益效果是
1、地图瓦片分层切割主要解决了内网离线使用的问题;
2、地图瓦片分层切割主要解决了在地图特定位置添加标记信息的功能;
3、地图瓦片分层切割可以形成丰富的配色,数据保密性强;
4、地图瓦片分层切割极少占用服务空间,可以实现有效的地图交互显示功能;
5、使用灵活,方便传输。
附图说明
图1是本发明的工作流程示意图。
具体实施方式
为使本发明实施例的目的、技术方案和优点更加清楚,下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例是本发明一部分实施例,而不是全部的实施例,基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例,都属于本发明保护的范围。
本发明主要包括如下几个步骤:
一、下载离线文件:
离线文件主要包括:
images文件(地图中要使用的图片、图标等);
maptile文件(主要包括所用到的地图区域的地图图片)
二、将瓦片地址改为本地图片
为了是地图中用到的图片都是本地图片,我们需要将瓦片地址改为本地图片,修改getmodules,将远程图片改为本地图片./images/,修改apiv.js:将tB:"http://api0.map.bdimg.com/getmodules",修改为:tB:"./js/getmodules",将//0==a.length?e.ny():La(e.Vu.tB+"&mod="+a.join(",")),修改为:0==a.length?e.ny():La(e.Vu.tB),!!!全景图!!!全景图模式必须在服务器环境下才能使用(即必须启动Apache)
swfSrc:"http://api.map.com/res/swf/APILoader.swf"
三、禁用canvas(IE8本身就不支持,对于Chrome、Firefox、IE9以上要通过源代码来禁用)
如果使用canvas,就不会使用瓦片图,所以这个函数改为直接返回false
以本地路径为例:
1.修改相关图片地址:(file:///D:/images/openhand.cur)
2.修改blank.gif地址:
//Sa.src="http://api.map.com/images/blank.gif?"+a.src
Sa.src="./images/blank.gif"
3.IE问题解决:
为了兼容IE9以下的版本,需要在demo里面增加一句:
<meta http-equiv="X-UA-Compatible"content="IE=edge,chrome=1">
四、页面引入
引入封装好的地图所用到的js,style样式文件,主要包括:
js文件(apiv、apiv_satellite、apiv_street、AreaRestriction、DrawingManager等)
style文件(DrawingManager,地图中所用到的样式文件表)
map.txt配置文件<script src="js/apiv_street.js"></script><script src="js/AreaRestriction.js"></script><script src="js/DrawingManager_one_rect.js"></script><link href="style/DrawingManager.css"/><!--<link href="bmap.css"/>-->
五、设置瓦片地图显示区域
添加瓦片地图的显示区域,设置div块的宽度、高度,边框颜色,粗细,背景等等,并给div块添加id唯一标识,名称自定义,以便后面脚本调用。
六、编写瓦片输出及特定标记代码
1.编写瓦片输出脚本,定义变量map并设置卫星图底图,地图文件以本地图片路径为准;
2.创建点坐标(point),精度和纬度;
3.初始化地图,设置中心的坐标和地图显示级别map.centerAndZoom(point,13);
4.设置是否启用滚轮放大缩小(enableScrollWheelZoom);
5.设置是否启用键盘操作(enableKeyboard);
6.设置地图显示的城市,此项是必须设置的setCurrentCity("城市名称");
7.设置地图放大缩小级别setMinZoom(),setMaxZoom();
8.设置特定标记代码,主要包括:标记显示位置(经纬度)、显示方式、边线颜色(十六进制)、填充颜色(十六进制),边线的宽度(数值),区域透明度(0-1),边线的样式(实线或虚线);
9.在标记区域内增加iframe,并添加要显示的的图表或页面src路径,设置iframe是否显示滚动条,是否显示边框等;
10.运行脚本文件;
七、配置调试
如果出现本地地图文件调取失败,返回配置文件检查原因,调整地图配置文件,继续向下执行;
八、瓦片标记代码调整
如果出现界面显示跟自己预想的不一致,返回脚本文件检查原因,调整代码,直到和自己预想的界面一致。
以上所述仅为本发明的较佳实施例,仅用于说明本发明的技术方案,并非用于限定本发明的保护范围。凡在本发明的精神和原则之内所做的任何修改、等同替换、改进等,均包含在本发明的保护范围内。
Claims (10)
1.一种基于离线地图瓦片特定标记添加的方法,其特征在于,
离线地图将日常中经常用到的地图保存成图片并通过软件自带功能进行切片,切片过程中选择切片方案,根据所选方案不同、地图级别,将整个地图切割成不同的瓦片,并重新拼接,通过配置本地文件,在离线的情况下使用地图;
地图瓦片分层切割通过经纬度在地图的特定位置添加相应脚本文件,通过iframe将外部的图表文件、相关界面引入到地图中来,让地图展示更加全面,美观,更直观的展示企业信息。
2.根据权利要求1所述的方法,其特征在,
主要包括如下几个步骤:
1)下载离线文件;
2)将瓦片地址改为本地图片;
3)禁用canvas;
4)页面引入;
5)设置瓦片地图显示区域;
6)编写瓦片输出及特定标记代码;
7)配置调试;
8)瓦片标记代码调整。
3.根据权利要求2所述的方法,其特征在于,
所述离线文件主要包括:
images文件;
maptile文件。
4.根据权利要求2所述的方法,其特征在于,
将瓦片地址改为本地图片为了是地图中用到的图片都是本地图片,需要将瓦片地址改为本地图片,修改getmodules,将远程图片改为本地图片./images/,修改apiv.js:将tB:"http://api0.map.bdimg.com/getmodules",修改为:tB:"./js/getmodules",将//0==a.length?e.ny():La(e.Vu.tB+"&mod="+a.join(",")),修改为:0==a.length?e.ny():La(e.Vu.tB),!!!全景图!!!全景图模式必须在服务器环境下才能使用
swfSrc:http://api.map.com/res/swf/APILoader.swf。
5.根据权利要求2所述的方法,其特征在于,
所述禁用canvas,包括
1)修改相关图片地址:(file:///D:/images/openhand.cur)
2)修改blank.gif地址:
//Sa.src="http://api.map.com/images/blank.gif?"+a.src
Sa.src="./images/blank.gif"
3)IE问题解决:
为了兼容IE9以下的版本,需要在demo里面增加一句:
<meta http-equiv="X-UA-Compatible"content="IE=edge,chrome=1">。
6.根据权利要求2所述的方法,其特征在于,
引入封装好的地图所用到的js,style样式文件,主要包括:
js文件
style文件
map.txt配置文件
<script src="js/apiv_street.js"></script>
<script src="js/AreaRestriction.js"></script>
<script src="js/DrawingManager_one_rect.js"></script>
<link href="style/DrawingManager.css"/>
<!--<link href="bmap.css"/>-->。
7.根据权利要求2所述的方法,其特征在于,
所述添加瓦片地图的显示区域,设置div块的宽度、高度,边框颜色,粗细,背景,并给div块添加id唯一标识,名称自定义,以便后面脚本调用。
8.根据权利要求2所述的方法,其特征在于,
所述编写瓦片输出及特定标记代码,主要包括
1)编写瓦片输出脚本,定义变量map并设置卫星图底图,地图文件以本地图片路径为准;
2)创建点坐标,精度和纬度;
3)初始化地图,设置中心的坐标和地图显示级别map.centerAndZoom;
4)设置是否启用滚轮放大缩小(enableScrollWheelZoom);
5)设置是否启用键盘操作(enableKeyboard);
6)设置地图显示的城市,此项是必须设置的setCurrentCity;
7)设置地图放大缩小级别setMinZoom(),setMaxZoom();
8)设置特定标记代码,主要包括:标记显示位置(经纬度)、显示方式、边线颜色(十六进制)、填充颜色(十六进制),边线的宽度(数值),区域透明度(0-1),边线的样式(实线或虚线);
9)在标记区域内增加iframe,并添加要显示的的图表或页面src路径,设置iframe是否显示滚动条,是否显示边框;
10)运行脚本文件。
9.根据权利要求2所述的方法,其特征在于,
所述配置调试时,如果出现本地地图文件调取失败,返回配置文件检查原因,调整地图配置文件,继续向下执行。
10.根据权利要求2所述的方法,其特征在于,
所述瓦片标记代码调整时,如果出现界面显示跟自己预想的不一致,返回脚本文件检查原因,调整代码,直到和自己预想的界面一致。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811639649.2A CN109726260B (zh) | 2018-12-29 | 2018-12-29 | 一种基于离线地图瓦片特定标记添加的方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811639649.2A CN109726260B (zh) | 2018-12-29 | 2018-12-29 | 一种基于离线地图瓦片特定标记添加的方法 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN109726260A true CN109726260A (zh) | 2019-05-07 |
CN109726260B CN109726260B (zh) | 2023-05-12 |
Family
ID=66299298
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201811639649.2A Active CN109726260B (zh) | 2018-12-29 | 2018-12-29 | 一种基于离线地图瓦片特定标记添加的方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109726260B (zh) |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110457408A (zh) * | 2019-06-24 | 2019-11-15 | 平安国际智慧城市科技股份有限公司 | 个性化地图下载方法、装置、设备及存储介质 |
CN112184904A (zh) * | 2020-09-28 | 2021-01-05 | 中国石油集团工程股份有限公司 | 一种数字集成方法和装置 |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
WO2005094466A2 (en) * | 2004-03-23 | 2005-10-13 | Google Inc. | Generating and serving tiles in a digital mapping system |
CN104063900A (zh) * | 2014-05-30 | 2014-09-24 | 中国科学院遥感与数字地球研究所 | 基于webGL的三维地球的实现方案 |
CN105339938A (zh) * | 2013-05-15 | 2016-02-17 | 谷歌公司 | 地图瓦片数据的有效取得 |
CN105608191A (zh) * | 2015-12-23 | 2016-05-25 | 云南电网有限责任公司 | 一种基于EnersunWebCache动态生成缓存电网地图瓦片的方法 |
CN108255864A (zh) * | 2016-12-29 | 2018-07-06 | 广东中科遥感技术有限公司 | 基于分布式存储和分布式计算的影像地图服务发布方法 |
-
2018
- 2018-12-29 CN CN201811639649.2A patent/CN109726260B/zh active Active
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
WO2005094466A2 (en) * | 2004-03-23 | 2005-10-13 | Google Inc. | Generating and serving tiles in a digital mapping system |
CN105339938A (zh) * | 2013-05-15 | 2016-02-17 | 谷歌公司 | 地图瓦片数据的有效取得 |
CN104063900A (zh) * | 2014-05-30 | 2014-09-24 | 中国科学院遥感与数字地球研究所 | 基于webGL的三维地球的实现方案 |
CN105608191A (zh) * | 2015-12-23 | 2016-05-25 | 云南电网有限责任公司 | 一种基于EnersunWebCache动态生成缓存电网地图瓦片的方法 |
CN108255864A (zh) * | 2016-12-29 | 2018-07-06 | 广东中科遥感技术有限公司 | 基于分布式存储和分布式计算的影像地图服务发布方法 |
Non-Patent Citations (1)
Title |
---|
牛艳霞等: "嵌入式Web服务器的Android空间数据离线解决方法", 《测绘科学》 * |
Cited By (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110457408A (zh) * | 2019-06-24 | 2019-11-15 | 平安国际智慧城市科技股份有限公司 | 个性化地图下载方法、装置、设备及存储介质 |
CN110457408B (zh) * | 2019-06-24 | 2020-12-04 | 平安国际智慧城市科技股份有限公司 | 个性化地图下载方法、装置、设备及存储介质 |
CN112184904A (zh) * | 2020-09-28 | 2021-01-05 | 中国石油集团工程股份有限公司 | 一种数字集成方法和装置 |
CN112184904B (zh) * | 2020-09-28 | 2022-10-18 | 中国石油集团工程股份有限公司 | 一种数字集成方法和装置 |
Also Published As
Publication number | Publication date |
---|---|
CN109726260B (zh) | 2023-05-12 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
Kropla | Beginning MapServer: open source GIS development | |
US7792331B2 (en) | Composition of raster and vector graphics in geographic information systems | |
Mitchell | Web mapping illustrated: using open source GIS toolkits | |
US7353114B1 (en) | Markup language for an interactive geographic information system | |
CN103208225B (zh) | 一种瓦片地图制作方法及系统 | |
Sutton et al. | A gentle introduction to GIS | |
CN109726260A (zh) | 一种基于离线地图瓦片特定标记添加的方法 | |
Skopeliti et al. | Online map services: Contemporary cartography or a new cartographic culture? | |
CN112269849A (zh) | 一种三维地图显示方法、系统、电子设备及存储介质 | |
Morgan et al. | Aerial mapping: methods and applications | |
CN115049758A (zh) | 基于WebGIS的专题地图制作方法、服务器以及存储介质 | |
Chías et al. | GIS tools for comparing historical and contemporary landscapes through local map series | |
Himiyama | The Land use/cover change programme in Japan: a review and proposals | |
CN109542996A (zh) | 基于GeoPDF技术的新型移动地图应用服务系统 | |
Hardy et al. | Mapping with Live Features-Object-Oriented Representation | |
Ghimire et al. | Web Mapping on Land Cover Change of Kathmandu, Lalitpur and Bhaktapur District | |
Tuurnala | Intelligent Chart Production System to meet the requirements of modern nautical chart production | |
菊澤律子 et al. | Developing a Fijian Language Geographic Information System | |
Béjar et al. | Incremental Construction of a Regional SDI, an Example Case in the Galicia Region | |
OHNO et al. | Publishing of digital topographic map 25000 | |
Maphanyane | The National Spatial Database Infrastructure (NSDI) in the Context of E-Governance Initiatives in Botswana | |
Millar | Establishment of a geographic information system in a county | |
Adamczyk | Testing the possibility of improving environmental objects representation adequacy, using the remote sensing data and its derivatives in a model of Geographical Information System for Biosphere Reserves | |
CN111723319A (zh) | 头图展示方法、装置、设备及存储介质 | |
Strand et al. | Implementation of OpenGIS-specifications: Web Map Service and Web Feature Service in the Solen-environment |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
TA01 | Transfer of patent application right |
Effective date of registration: 20230413 Address after: 250000 Langchao Science Park, No. 1036, Langchao Road, high tech Zone, Jinan, Shandong Applicant after: Inspur Software Technology Co.,Ltd. Address before: 250100 First Floor of R&D Building 2877 Kehang Road, Sun Village Town, Jinan High-tech Zone, Shandong Province Applicant before: SHANDONG INSPUR BUSINESS SYSTEM Co.,Ltd. |
|
TA01 | Transfer of patent application right | ||
GR01 | Patent grant | ||
GR01 | Patent grant |