如何实现点击地图上某点，添加点击效果

image.png

应用场景

世界地图，点击中国，在中国的中心位置弹出中国的简介；
某小区的平面图，点击某栋楼，在该楼位置弹出该楼的简介；

实现思路

思路一、
1、地图的拼接：
将每个国家都切成一张图片，图片大小是整张地图的大小，每张图片在对应国家的位置上只显示该国家的图，其他位置均为透明。然后将每张图片叠放到一起，就拼接成了一张世界地图。
2、事件的监听
在每张图片上添加点击事件（如果需要有点击高亮的效果，可以通过将图片设置为按钮的背景图），通过事件拦截，判断点击的位置在哪张图片上不是透明的，就可以判断出点击的是哪个国家。
3、找到点击国家需要显示气泡的位置。
每张图片绑定了该国家的一些数据：如气泡坐标。

思路二：
1、采用1张完整的地图，无需拼接，省去了美工的工作（如果需要有点击效果，也可以采用思路一的拼图方式）
2、绑定每个国家的位置和介绍等数据
每个国家通过1个或多个矩形来表示自己的位置，国家形状不规则，可能需要多个矩形来表示，矩形越小，国家之间的位置区分越清晰，不会造成点击靠近国家临界位置时，别的国家响应了事件。每个国家的矩形是不会有交集的。每个矩形都是一个对象，该对象中还包含了显示气泡的位置，国家的介绍等信息
3、在地图上添加点击事件，找到点击国家信息
通过判断点击的位置，是在哪个矩形内，就能获知点击的是哪个国家