本文相关内容只用于个人研究,若用于商业请自行负责。
?
1. 下载Google地图切片到本地:如果没有要求地图显示中文,则可以用Google Maps Downloader下载Google地图到本地;如果要显示中文地图,则要用China Google Maps Downloader
?
2. 在tomcat服务器建个项目gmcn,为了方便查找文件,将文件按照zoom/x存放,如图:
?
3. 利用OpenLayers.Layer.TMS显示地图,重点是get_my_url()找到要显示的切片
?
<html> <head> <title>Google Local Tiles</title> <link rel="stylesheet" href="css/style.css" type="text/css" /> <script src="js/OpenLayers/lib/OpenLayers.js"></script> <script type="text/javascript"> var map, layer; //complex object of type OpenLayers.Map //Initialise the 'map' object function init() { map = new OpenLayers.Map("map", { maxExtent : new OpenLayers.Bounds(-20037508.3427892, -20037508.3427892, 20037508.3427892, 20037508.3427892), numZoomLevels : 18, maxResolution : 156543.0339, units : 'm', projection : "EPSG:900913", displayProjection : new OpenLayers.Projection("EPSG:4326") }); layer = new OpenLayers.Layer.TMS("Name", "http://10.0.0.239:8081/gmcn/", { 'type' : 'png', 'getURL' : get_my_url }); map.addLayer(layer); map.addControl(new OpenLayers.Control.Scale()); map.addControl(new OpenLayers.Control.MousePosition()); map.addControl(new OpenLayers.Control.LayerSwitcher()); var lonLat = new OpenLayers.LonLat(117.62519, 39.52329); lonLat.transform(map.displayProjection, map.getProjectionObject()); map.setCenter(lonLat, 8); } function get_my_url(bounds) { var res = this.map.getResolution(); var x = Math.round((bounds.left - this.maxExtent.left) / (res * this.tileSize.w)); var y = Math.round((this.maxExtent.top - bounds.top) / (res * this.tileSize.h)); var z = this.map.getZoom(); var path = "" + z + "/" + x + "/gmcn_" + x + "_" + y + "_" + z + "." + this.type; var url = this.url; if (url instanceof Array) { url = this.selectUrl(path, url); } return url + path; } </script> </head> <!-- body.onload is called once the page is loaded (call the 'init' function) --> <body onload="init();"> <!-- define a DIV into which the map will appear. Make it take up the whole window --> <div style="width: 100%; height: 100%" id="map"></div> </body></html>?
参考:
Using Custom Tile Sources / Google-like Tile Layer Support
?
1 楼 dxqrr 2012-05-21
mark下,学习了