AGM地图填充容器

时间:2017-12-20 21:43:56

标签: html css angular google-maps typescript

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

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

(当然我不是使用风格而是使用css,仅举例)

我希望agm-map能够填充容器div,无论其高度或宽度如何,总是填满它。当agm map只在 px vh 中想要高度时,我无法解决它。

同时调整大小和责任也很棒。

1 个答案:

答案 0 :(得分: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%;
  }
}

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