Angular 中的 Google 地图在使用选项时不显示地图



我正在尝试使用@angular/google-maps在我的Angular应用程序中设置一个谷歌地图实例,一开始一切都非常简单;我使用本教程安装并创建了元素:https://timdeschryver.dev/blog/google-maps-as-an-angular-component

问题是,当我输入选项输入变量时,地图停止显示,并且控制台中没有消息。

这是没有选项的代码:

<google-map
[width]="'100%'"
[height]="'100%'"
[center]="center"
[options]="mapOptions"
></google-map>

在这种情况下,显示的内容如下:

这是没有选项的工作示例

<google-map
[width]="'100%'"
[height]="'100%'"
[center]="center"
></google-map>

使用以下选项:

import MapOptions = google.maps.MapOptions;
mapOptions: MapOptions = {
mapTypeId: 'hybrid',
zoomControl: false,
scrollwheel: false,
disableDoubleClickZoom: true,
maxZoom: 15,
minZoom: 8
};

这是我放置选项时显示的内容:

这是具有选项并且以某种方式不起作用的示例

我到处寻找,似乎找不到任何解决方案; 当然,我已经按照文档中的规定对其进行了配置,但它不起作用。我也尝试使用较少或没有选项,但它也不起作用。由于控制台中没有输出,我只是无法找出问题所在......

我遇到了同样的问题。

我实际上不知道为什么,但是在选项中设置缩放级别为我修复了错误:

mapOptions: MapOptions = {
mapTypeId: 'hybrid',
zoomControl: false,
scrollwheel: false,
disableDoubleClickZoom: true,
maxZoom: 20,
minZoom: 8,
zoom: 19
};

相关内容

  • 没有找到相关文章

最新更新