高德地图API中覆盖物的精准定位体系——基点+偏移量

大家在看高德地图API网站上的js api范例程序时，经常会看到代码注释中提到“基点”这个字眼，例如下面一段代码：

function addMarker(){
	//构建点对象
	var marker = new AMap.Marker({
		id:"m23",//唯一ID
		position:new AMap.LngLat(116.37388157654,39.907409934248), //基点位置
		icon:"http://api.amap.com/webapi/static/Images/marker_sprite.png", //marker图标，直接传递地址url
		offset:{x:-8,y:-34} //相对于基点的位置
	});
	mapObj.addOverlays(marker);//将点添加到地图

	var info = [];
	info.push("<b>  高德软件</b>");
	info.push("  电话 : 010-84107000   邮编 : 100102");
	info.push("  地址 : 北京市望京阜通东大街方恒国际中心A座16层");
	
	var inforWindow = new AMap.InfoWindow({
		offset:new AMap.Pixel(45,-34),
		content:info.join("<br />")
	});
	mapObj.bind(marker,"click",function(e){
		inforWindow.open(mapObj,marker.getPosition());
	});
}

 那么什么是基点，怎么对覆盖物进行精准的定位？

　　如果我们要在地图上添加一个Marker，则其位置是一个坐标，这个坐标位置即是Marker的基点。对于弹出信息窗口（InfoWindow）来说，基点就是其需要打开的位置。对于Marker来说，要做到精确将图标放置到指定的位置，并且能够使得图标的任意位置对准基点，则需要设置offset属性，即偏移量。

　　熟悉HTML代码的网友都知道，图标（或者信息窗口）显示的时候，指定的坐标位置是与其左上角对齐的。所以要通过offset（相对于基点在x方向和y方向的偏移量）来进行精准设置。

关于偏移量设置，请看下图的示例说明：

　　

有了“基点+偏移量”这套定位体系，大家可以根据自己的需要，任意调整覆盖物的显示位置了。