iphone上的agm地图angular6(safari和chrome)缩放或标记位置更改后的渲染问题

Question

我在我的angualr 6 web应用程序中使用agm映射。它在android设备上也可以在pc上工作，但在iphone上，当缩放或标记改变位置时，我会遇到这个问题。如果我触摸地图，"未渲染"的点将被渲染，地图将再次正确显示。我试图在(zoomChange((centerChange((boundsChange(上触发此.gamMap.trigerResize((，但没有帮助。

.html
<div *ngIf="isDelivery" style="margin-bottom: 25px">
<agm-map #AgmMap  (zoomChange) ="triggerResize()" (centerChange)="triggerResize()" (boundsChange)="triggerResize()"
[latitude]="lat" [longitude]="lng" [zoom]= 14 [streetViewControl]=false [disableDefaultUI]=true
[disableDoubleClickZoom]=true [fullscreenControl]=true [zoomControl]=true [gestureHandling]="cooperative"
[clickableIcons]=false>
<agm-marker [visible]="dsService.isMarkerVisible" [latitude]="lat" [longitude]="lng"></agm-marker>
</agm-map>
</div>

.ts
import { AgmMap } from '@agm/core';
@ViewChild('AgmMap') public agmMap: AgmMap;
triggerResize(){
this.agmMap.triggerResize().then(x=>{console.log(x)}).catch();
}
private trackMe() {
if (navigator.geolocation) {
this.watchID = navigator.geolocation.watchPosition((position) => {
this.dsService.isMarkerVisible = true;
this.currPosition = position;
this.lat = position.coords.latitude;
this.lng = position.coords.longitude;
this.agmMap.triggerResize().then().catch();
}
, (error) => {}
, { maximumAge: 5000, timeout: 5000, enableHighAccuracy: true }
);
}
}
.css
agm-map {
height:250px!important;;
width: 100%;
}

Answer 1

而不是分别使用Lat、Lng。创建一个对象，比如UserObj=｛Lat:0，Lng:0｝大多数时候，这为我解决了问题。