谷歌地图瓦片相关操作（js，google Maps v3）

标签：google地图

前段时间，由于工作原因，研究了谷歌地图的瓦片相关操作。已知一个点的经纬度和地图级别，获取该点所在的瓦片的url；已知一个瓦片的url，计算该瓦片左上角经纬度；已知一个点经纬度和地图级别，计算这个点在世界地图上的像素值。

1、已知一个点的经纬度和地图级别，获取该点所在的瓦片的url

参考了两篇博客：这个博客（http://blog.csdn.net/lijun_xiao2009/article/details/8178578）中的原理，但是使用到的公式太难算了，就结合了另一篇博客（http://blog.csdn.net/zhaobmox/article/details/1253005）里面的运算。

//管理瓦片路径
function CalculationUrl(Val_lat,Val_lng)
{
	Val_lng = parseFloat(Val_lng);
	Val_lat = parseFloat(Val_lat);
	
	var Val_zoom = MapAttr.CUTZOOM;//地图级别，设置为了全局变量
	var zoomN = Math.pow(2,Val_zoom);
	
	var x = CalculationLng(Val_lng);
	var y = CalculationLat(Val_lat);
	//UrlDiv
	var url_x = x*zoomN;
	var url_y = y*zoomN;
	
	return [Math.floor(url_x),Math.floor(url_y)];
	
}

//根据经度计算瓦片x值
function CalculationLng(lng)
{
	var x = (180.0 + parseFloat(lng)) / 360.0;
	return x;
}

//根据纬度计算瓦片y值
function CalculationLat(lat)
{
	var PI = Math.PI;//3.1415926535897;
	var y = -parseFloat(lat) * PI / 180; 
	y = 0.5 * Math.log((1+Math.sin(y)) / (1 - Math.sin(y)));
	y *= 1.0/(2 * PI); 
	y += 0.5;
	return y;
}

2、已知一个瓦片的url，计算该瓦片左上角经纬度

参考了博客：http://www.cnblogs.com/Tangf/archive/2012/04/07/2435545.html

function CalculationLatlng(x,y)
{
	var PI = Math.PI;
	var zoomN = Math.pow(2,MapAttr.CUTZOOM);//地图级别，设置为全局变量
	
	var lng = x/zoomN*360.0-180.0;
	var a = PI*(1-2*y/zoomN);
	var e = Math.E;
	var rad = (Math.pow(e,a)-Math.pow(e,-a))*0.5
	var latrad = Math.atan(rad);
	var lat = latrad*180.0/PI;
	return {"lat":lat,"lng":lng};
}

参考了百度文库：http://wenku.baidu.com/link?url=LG31kM26TJHtYTmBkWMQ92lNEu7P-aUKEowFrEj62Rbsgrc7SiVe9vk2RQ64Sk0dlMvfs1zeiDMx44skLxVZYcT_nJw2guhJQyXksXBvmaK

//计算一个点的在世界地图上的像素值
function CalculationPixelDistance(lat,lng)
{
	var zoom = MapAttr.CUTZOOM;<span style="font-family: Arial, Helvetica, sans-serif;">//地图级别，设置为全局变量</span>

	
	//该坐标相对世界地图的第一片瓦片的像素
	var X = lngToPixel_x(lng,zoom);
	var Y = latToPixel_y(lat,zoom);

	return {x:Math.floor(X),y:Math.floor(Y)};
}

//根据经度计算x像素值
function lngToPixel_x(lng,zoom)
{
	return (lng+180)*(256<<zoom)/360;
}

//根据纬度计算y像素值
function latToPixel_y(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));
}

谷歌地图瓦片相关操作（js，google Maps v3）

标签：google地图

原文地址：http://blog.csdn.net/fulai0_0/article/details/42970755