封面图
从高德地图官网中截得一个画面
场景
前两天在做一个热力图的效果，需求是用高德地图绘制热力图，然后热力图支持点击事件，然后获取后端返回的具体的点坐标信息，根据这个信息去取别的信息弹框展示，大致就这么个需求。
然后，查看文档的时候，发现：地图的点击事件和热力图的点击事件不是一回事儿。
简而言之：地图支持点击事件，获取地图上的坐标；但是，热力图没有点击事件，所以无法获取热力图中具体的点的信息。
获取不到具体的点的信息，下面的业务逻辑就无从谈起。
跟后端商量了了一下，最终的解决方案改为：
点击地图，拾取地图坐标后找出距离这个坐标最近的点，然后弹框展示后续的业务逻辑。
这样一来，业务逻辑就顺理成章的完成了。
另一个需求
恰逢另外一个同学也有一个热力图的需求，考虑到他那边上线安排比较着急，热力图又不能支持点击事件，获取不到具体的信息，所以用了另外一个方案：用自定义Marker将所有的点标记出来。
功能发布之后，第二天后端人员反馈地图有严重的卡顿现象。
然后就开始排查原因，如下图：
这个图是有2000个点的时候，地图的缩放功能还算是比较流畅；但是当坐标数量增加到4000左右，地图已经相当卡顿了。
4200个点
为什么会这样呢? 打开控制台，找到Marker的Dom元素，我们会发现:Marker其实是用固定定位标记在地图上的一堆Dom元素。
Marker
这样一来，马上就真相大白了：这么多Dom节点，无限制的触发DOM的回流机制，浏览器必定是吃不消的，何况4000个点，只是数据中很少的一部数据。
总结
- 当没有合适的技术方案时，可以使用一些其他方案暂时代替，
先支持业务，后进行优化迭代。 - 地图的自定义Marker使用场景时，理论上也是有数量限制的，宜少不宜多。
其实我想知道这么多点，是怎么绘制到地图上的，分批创建吗? 有可能吧~