你的位置:首页 > 软件开发 > ASP.net > Web GIS 离线地图

Web GIS 离线地图

发布时间:2016-01-18 11:00:26
Web GIS 离线地图 1,基于瓦片的离线地图下载博客园 阿凡卢 提供了离线地图的下载工具,下载地址:http://pan.baidu.com/s/1hqvQr7e 具体使用见 参考资料2阿凡卢 提供的地图下载软件,对于导出的瓦片图片的目录是基于ArcGIS ...

Web GIS 离线地图

 

1,基于瓦片的离线地图下载

博客园 阿凡卢 提供了离线地图的下载工具,下载地址:http://pan.baidu.com/s/1hqvQr7e 具体使用见 参考资料2

Web GIS 离线地图

阿凡卢 提供的地图下载软件,对于导出的瓦片图片的目录是基于ArcGIS切片目录,我编写了将导出到Mysql数据库中的瓦片数据导出为{type}/{z}/{x}/{y}.png 格式。具体步骤如下:

A 使用 阿凡卢 提供的地图下载软件将地图导出到Mysql数据库

B 使用我开发的软件把Mysql数据库中的瓦片数据导出到本地文件 点击这里下载

Web GIS 离线地图

导出的图片目录如下:

Web GIS 离线地图   

Web GIS 离线地图

这二步做好了以后,在get='_blank'>IIS上新建一个空的网站,把我们的地图切片拷贝过去即可。

2,前端JS 用来加载地图的瓦片数据

前端推荐使用 Leaflet ,这里我已经把相关的 css,js 下载到了本地。具体 代码如下:

<html>  <head>    <title>离线地图</title>    <link rel="stylesheet" href="dist/leaflet.css" />    <!--[if lte IE 8]>    <link rel="stylesheet" href="dist/leaflet-ie.css" />    <link rel="stylesheet" href="dist/locate-ie.css"/>    <![endif]-->    <link rel="stylesheet" href="dist/mobile.css" />    <link rel="stylesheet" href="dist/locate.css" />      <script src='/images/loading.gif' data-original="dist/leaflet.js"></script>    <script src='/images/loading.gif' data-original="dist/proj4js-compressed.js"></script>    <script src='/images/loading.gif' data-original="dist/proj4leaflet.js"></script>    <script src='/images/loading.gif' data-original="dist/locate.js" ></script>  </head>  <body>    <div id="map"></div>  </body>  <script type="text/javascript">    var map = L.map('map').setView([31.2269, 121.4648], 12);    L.tileLayer('http://localhost:8080/1818940751/{z}/{x}/{y}.png', {      attribution: '&copy; Google China'    }).addTo(map);        L.marker([31.229243, 121.479950]).addTo(map)      .bindPopup('DTS 1<br>31° 38° 49°')      .openPopup();  </script>

原标题:Web GIS 离线地图

关键词:web

web
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。