高德地图自定义标记点marker缩放偏移问题

高德地图自定义标记点marker缩放偏移问题

在使用高德地图点标记功能，自定义图标或内容时，如果对地图进行缩放，可以发现会此时图标会存在偏移，定位不准现象

原因：造成这种现象的原因其实是对标记点的偏移量offset属性理解不准确导致，查阅官方文档得知，offset默认值是[0,0]，就是定位中心点是在图标的左上角，带着此种思维再去看刚才的效果就可以发现，其实是没有偏移的，只是图标定位点在底部，缩放时造成的视觉上错觉，我们可以看到，如果把视觉焦点聚焦在左上角[0,0]的位置，其实定位一直是准确的。造成这种误导还有个原因就是当我们使用高德默认图标时，没有设置偏移量，就认为也是默认的[0,0]，但定位没有视觉偏差，大概率是高德内部做了偏移量处理。为了符合图标底部是实际定位点的效果，可以看到图标大小是35*38，基于左上角原点，x轴偏移半个宽度，y轴偏移整个高度即可，即offset: [-17.5, -38]

let centerMarker = new this.AMap.Marker({
									position: new this.AMap.LngLat(item.parkLongitude,
										item.parkLatitude),
									// 将一张图片的地址设置为 icon
									icon: startIcon,
									// 设置了 icon 以后，设置 icon 的偏移量，以 icon 的 [center bottom] 为原点
									offset: new AMap.Pixel(-17.5, -38)
								});