同页面创建两个百度地图实例显示不正常

最近在做毕设项目，要搭一个网站（体力活，没什么技术含量），其中有几个页面需要地图显示。考虑到去年暑假玩过两个月的百度地图API，也算半个老司机了，就自然地准备接着用，直到出现了下面的问题。

页面施工第一阶段：

Paste_Image.png

（美滋滋的没什么毛病）

页面施工第二阶段：

Paste_Image.png

此时就出现弹出页面中的地图模块中有空白的情况。

身为半个老司机，我立刻想到了这应该是出了冲突，将主页面的地图部分注释掉后，弹出页面显示正常：

Paste_Image.png

此时我首先怀疑的是变量声明语句出了问题，

    var map = new BMap.Map("allmap", {enableMapClick: false});
    var point = new BMap.Point(116.404, 39.915);
    map.centerAndZoom(point, 15);

    var map = new BMap.Map("modalmap", {enableMapClick: false});
    var point = new BMap.Point(116.404, 39.915);
    map.centerAndZoom(point, 15);

这两段语句虽然放在了不同的函数块下，但是都是用var声明的，让人有理由怀疑我大概是踩中了ES6的坑。
然而我把下面的变量名改掉后，依然没什么用。

跑到百度开发者社区上逛了一圈，发现类似问题还是有不少人反映的：

Paste_Image.png

这个人应该是内部人员，看到发帖日期，感觉心凉了半截：

Paste_Image.png

最后我发现高德导航在这方面做得还是挺不错的:D

Paste_Image.png

The End：
查看页面元素可以发现地图模块被重新划分成了很多标签，大致揣测下其后端应当是将整个地图分块分层做了预渲染，形成很多图片，其API调用就是对这些图片的get请求以及再拼接的过程。而在这些图片被多个实例调用的场景下，百度地图出了bug，而且可能是数据结构级别的缺陷，才难以修复（当然不排除其他原因）。

（还是阿里爸爸牛掰）