AGM 地图填充容器

Posted 2023-02-23

【中文标题】AGM 地图填充容器

【英文标题】：AGM Map filling container

【发布时间】：2018-06-03 12:42:51

【问题描述】：

我正在使用 angular2 和谷歌地图组件https://angular-maps.com/。我试图解决的问题是我需要地图填充我的容器 div，例如：

<div id="container" style="height:100%; width: 100%">
<agm-map></agm-map>
<div>

（当然我不是用样式而是css，这只是例子）

我希望该 agm-map 填充容器 div，无论其高度或宽度如何，始终将其填充。当 agm 地图只需要 px 和 vh 的高度时，我无法解决它。

调整大小和承担责任也很棒。

【参考方案1】：

我不能讲太多细节，但是我公司有这样的html

<div fxFlex="100" class="map-full-card-content">
  <agm-map [fitBounds]="latlngBounds"></agm-map>
</div>

带有 .scss 文件的

.map-full-card-content 
  height: 100% !important;
  width: 100%;
  margin: 0;

  agm-map 
    height: calc(100% - 12px) !important;
    width: 100%;
  

它似乎可以很好地填充容器和调整大小。

【讨论】：

你能解释一下如何创建那个 latlngBounds 变量吗？

***.com/questions/1556921/… 这是一个很好的资源。我基本上将我的点格式化以添加到地图中，并在链接中进行评分最高的评论。我这都是在api加载函数this.mapsAPILoader.load().then(() =>