我有我的web应用程序提供离线地图这个很基本的要求。 我的Web应用程序用于显示地图无法访问互联网,因此所有在线的API被完全排除。
做研究之后,我下载所需位置的.osm.pbf格式文件(说某个城市)。 一世
转换.osm.pbf到.osm文件
下一步我生成使用此.osm文件瓷砖。
瓷砖存储在我的本地目录。
我的最后一步是显示这些瓷砖在网络浏览器的地图我的应用程序(Java EE的)内,并把给定位置的纬度和经度的标记。
这是我要的离线地图内显示的唯一要求。
我有一个特别的city.But我不知道如何使用它,并显示离线地图瓦片..
通过术语离线我的意思是,应用程序是基于Intranet托管应用程序服务器上,任何情况下,提供互联网接入。
请指导。
首先你需要一个映射库,可以下载并驻留在您的应用程序中。 有几个,但最常见的是单张和的OpenLayers 。 两者都支持自定义图块层。
例如,假设你的砖是在一个叫“砖”的文件夹,一个可能的层定义是(以单张)的网络应用程序中:
var map = L.map('map');
L.tileLayer('tiles/{z}/{x}/{y}.png').addTo(map);
甚至在企业内网其它机器
var map = L.map('map');
L.tileLayer('http://intranetmachine/tiles/{z}/{x}/{y}.png').addTo(map);
你快到了。
保存单张的.js和.css文件在本地。
- http://leafletjs.com/dist/leaflet.css
- http://leafletjs.com/dist/leaflet.js
看到此基本实施例的源代码: http://leafletjs.com/examples/quick-start-example.html
作为描述的.css,.js文件路径的本地副本,以及tileLayer路径更改为本地。
见标记的代码:
L.marker([51.5, -0.09]).addTo(map)
.bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup();
我猜这就是你所需要的。 取出其他的多边形,如果需要的点击显示-LAT-长功能。
如果你想在地图全屏,改变<div..
标签为100%。
<div id="map" style="width: 100%; height: 100%"></div>