Bootstrap 4 这里是地图赢得'；如果从一开始就不可见，则不显示

我正在尝试在我的web应用程序中包含这些地图。地图应该在用户单击按钮/链接以展开引导折叠面板后显示

如果我把包含地图的div放在可折叠面板的外面，它就工作了

我在JSFIDLE中的代码

我的HTML

我的JS代码

var平台=新的H.service.platform({
'app_id'：'{app_id}'，
“应用程序代码”：“{应用程序代码}”
});
//从平台对象获取默认贴图类型：
var defaultLayers=platform.createDefaultLayers（）；
//实例化（并显示）地图对象：
变量映射=新的H.映射(
document.getElementById（'map'），
defaultLayers.normal.map{
缩放：10，
中心：{
拉丁美洲：52.5，
液化天然气：13.4
}
});

我希望在单击“链接带href”链接后显示地图。但是，此处显示了一些SVG贴图，并且没有加载贴图分幅

编辑：

---

添加了当前状态的屏幕截图（缺少发布图像的信誉）

此处地图画布动态获取其父div的宽度和高度（在本例中：

）

因此，首先必须向map div添加

宽度

和

高度

，如下所示：

其次，您应该注意，引导可折叠元素中的子元素在折叠时的宽度和高度将等于零（

display:none

），在展开时的实际值将等于零（

display:block

）

---

因此，应该在展开可折叠元素时绘制HERE贴图（这样贴图的宽度和高度就可以非零）。您可以使用JQuery检查按钮/链接是否被单击，以及“映射”div是否可见。

从浏览器的console部分inspect元素中选择一个屏幕以显示错误并发送至check控制台上是否没有错误。从这里映射的画布以0px宽度和0px高度初始化。正如您所建议的，我在按钮上添加了一个click eventlistener。就在这次活动中，我添加了地图。然后一切都如预期的那样。@JB您能解释一下您为使映射工作所做的工作吗？例如，如果可能的话，请粘贴代码。在我的例子中，我正在使用引导模式，并提前感谢您。我只是在创建包含映射的元素之后添加了映射。