1

我已经用 Angular 4 安装了 Angular 谷歌地图。

模板很简单：

<agm-map [latitude]="58.150587" [longitude]="7.978571" [zoom]="19" [mapTypeId]="'satellite'"></agm-map>

我得到的是一个不错的 3D 版本，如下所示：

像这样

我希望它是卫星视图。但我不想要 3D 效果。我希望它是平面的，二维的，像这样：

像这样

4

1 回答 1

2

我在我的一个应用程序中使用了这个模块，显示的地图是 2d 的。与您的代码的唯一区别是我没有的 [mapTypeId] ：

<div class="map">
    <agm-map [latitude]="lat" [longitude]="lng" [zoom]="17">
        <agm-marker [latitude]="lat" [longitude]="lng"></agm-marker>
    </agm-map>
</div>

[maptypeId] 属性有 4 个可能的值：

路线图，这是您想要的（如果未提供该属性，则默认为路线图）

卫星，这是一个谷歌地球表示

混合+地形，但我从未使用过这些。

为了获得 2d 表示，删除属性或将其值更改为 [mapTypeId]="'roadmap'"

编辑：留下以前的答案，因为它可能对其他人有帮助，但您的确切问题的解决方案如下：

您需要在您的 agm-map 标签上添加一个 mapReady 事件

<agm-map [latitude]="lat" [longitude]="lng" [zoom]="17" [mapTypeId]="'hybrid'" (mapReady)="changeTilt($event)">

当谷歌地图完全初始化时会触发此事件。结果它将返回您的 google.maps.Map 实例。您需要创建一个私有属性才能存储它。

private _map: any;

然后您可以更改属性并使用您想要的方法：

changeTilt(map) {
    this._map = map;
    this._map.setTilt(0);
}

我非常感谢 cholexa 为这个解决方案提供了巨大的帮助（在 angular2-google-map gitter 聊天中）

于 2017-06-14T12:56:24.933 回答