使用稻歌Google Map截获器和Openlayer制作内网地图

适用环境：
为企业内网提供地图信息服务。

准备工作：
下载稻歌Google Map截获器
http://www.daogle.com/daogle_download
下载Openlayer
http://www.openlayers.org/
稻歌Google Map截获器用于获取谷歌的原始瓦片；
通过Openlayer展示谷歌瓦片，并提供定位，轨迹等功能。

1、通过稻歌Google Map截获器获取谷歌瓦片
点击软件设置，在弹出窗口中是否保留Google原始网子图，选【是】，保存设置；
在右上角选择地图类型包括地形、卫星、混合地图、地形等；
在地图上选定相关区域的地图，点击确定进行截获；
操作结束后，瓦片图保存在软件设置中格网子图存放位置中说明的位置中。

注意1：稻歌Google Map截获器在获取1万张以上谷歌原始瓦片时会获取不全，需要根据经纬度切分要获取的地图信息分别获取。
2、，使用openlayer展示谷歌瓦片

var map ;

function init(){

	map = new OpenLayers.Map("map",{numZoomLevels:12});
	var ol_wms = new OpenLayers.Layer.TMS("地图图层","",{ 'getURL':getImg,layers: "basic"});
	map.maxExtent = new OpenLayers.Bounds(-180,-90,180,90);
	var thislonLat ;
	map.addLayers([ol_wms]);
	map.addControl(new OpenLayers.Control.MousePosition({
		//重写鼠标获取经纬度，修正纬度
		formatOutput:function(lonLat){
			thislonLat = lonLat;
			var digits = parseInt(this.numDigits);
	        var newHtml =
	            this.prefix +
	            lonLat.lon.toFixed(digits) +
	            this.separator + 
	            Math.round(aCheckLatiude(lonLat.lat.toFixed(digits),map.getZoom())*100000)/100000 +
	            this.suffix;
	        return newHtml;
		}
	}));
	map.addControl(new OpenLayers.Control.LayerSwitcher());
	
	map.setCenter(new OpenLayers.LonLat(119, 26.31),7);
	
	function getImg(bounds){
		var x = Math.round(Math.pow(2,this.map.getZoom())*(bounds.left+180)/360);
		x = Math.round(x);
		var y = Math.round(Math.pow(2,this.map.getZoom()-1)*(90-bounds.top)/180+Math.pow(2,this.map.getZoom()-2));
		var z = this.map.getZoom();
		//由于地图放在同一个文件夹中数量太大难以管理，采用缩放等级及横坐标的形式建立文件夹进行管理，z表示缩放等级，x表示横坐标
		var imgUrl = "pt/"+z+"/"+x+"/m_"+ z + "_"+ x + "_" + y + ".png"
		return imgUrl;
	}	
}

/*根据纬度坐标换算像素*/
function  latToPixel(lat, zoom) {
	var siny = Math.sin(lat * Math.PI / 180);
	var y = Math.log((1 + siny) / (1 - siny));
	return (128 << zoom) * (1 - y / (2 * Math.PI));
}
/*根据像素换算纬度坐标*/
function pixelToLat(pixelY, zoom) {
	var y = 2 * Math.PI * (1 - pixelY / (128 << zoom));
	var z = Math.pow(Math.E, y);
	var siny = (z - 1) / (z + 1);
	return Math.asin(siny) * 180 / Math.PI;
}

/*定位*/
function setCenter(longitude,latitude){
	map.setCenter(new OpenLayers.LonLat(longitude, checkLatitude(latitude,map.getZoom())));
	
	var features = [
	    new Feature(
	        new Geometry.Point(longitude, checkLatitude(latitude,map.getZoom())),
	        {cls: "greenMark"}
	    )  
	];
	linelayer.addFeatures(features);
}
/*修正经度偏差*/
function checkLongitude(longitude){
	return longitude;
}
/*由于谷歌瓦片使用和openlayer不同的坐标系，需要对纵坐标进行修正，修正维度偏差*/
function checkLatitude(latitude,zoom){
	var totalPixel = latToPixel(-85.05112878,zoom);
	var thisPixel = latToPixel(latitude,zoom);
	var latitude = 90*(totalPixel/2-thisPixel)/(256*Math.pow(2,zoom-2));
	return latitude
}
/*修正纬度偏差的反函数*/
function aCheckLatiude(latitude,zoom){
	var totalPixel = latToPixel(-85.05112878,zoom);
	var thisPixel = totalPixel/2-latitude*(256*Math.pow(2,zoom-2))/90;
	return pixelToLat(thisPixel,zoom);
}

基于以上可以使用谷歌瓦片在内网应用中提供定位、轨迹管理等功能，附件中使用福建省莆田市部分瓦片作为参考。

注意2：文件系统格式为FAT32对文件总数有数量限制，如瓦片数量较多应使用NTFS作为文件系统格式。
注意3：由于谷歌瓦片使用了火星坐标，地图位置和实际位置通过GPS获得的坐标用一定偏差，需根据不同城市进行修正。

最后，感谢大漠穷秋,感谢大漠穷秋的脚本娃娃系列群，感谢丐帮，感谢丐帮老男孩提供思路。

评论

1 楼 s33ker 2013-08-04  

你好，有个问题，
①、map.setCenter(new OpenLayers.LonLat(119, 26.31),7);
这里设置的中心点坐标我查了下不是莆田市的坐标，而是纬度比原坐标增大后的
那如果我想设置别的地方的原坐标为中心点，该用什么方法转成比原坐标纬度大一些的坐标，来正常显示我截取的瓦片呢？
②、为啥会出现需要增大纬度这个问题呢，这不是大家所说的偏移吧？
③、还是由于坐标系的原因需要转换，如果是的话该怎么转换呢？哪个坐标系转成哪个？
望楼主看到后，回答下！ 万分感谢