将 google 地图屏幕导航到更新的标记位置
Navigate google map screen to updated marker position
我正在使用 AGM(angular google 地图) 来制作地图。我放了一个 getCurrentLocation 按钮,其中 returns 我当前位置的纬度和经度。我能够将标记更新到那个地方,但我的地图没有导航到那个特定位置。这是我的示例代码。
getCurrentLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition((response) => {
this.setPosition(response);
}, function () {
alert("Unable to get the GPS location");
}, { maximumAge: 60000, timeout: 5000, enableHighAccuracy: true });
};
}
这是我的 setPosition 方法
setPosition(position: Position) {
this.marker.lat = position.coords.latitude;
this.marker.lng = position.coords.longitude;
//What to do here to move screen to this marker position
}
这是更新标记后的屏幕。标记丢失。谢谢
您可以向 agm-map
组件提供纬度和经度,使地图以该坐标为中心。
<agm-map [latitude]="latitude" [longitude]="longitude">
<agm-marker [latitude]="latitude" [longitude]="longitude"></agm-marker>
</agm-map>
以上示例使地图围绕标记居中。
来自API docs:
latitude
: 定义地图中心的纬度。
longitude
: 定义地图中心的经度。
我能够找出问题所在。基本上问题是我用不同的变量映射 'agm-marker' 和 'agm-map' [纬度] 和 [经度]。因此,一旦我开始使用相同的变量对其进行映射,它就开始正常工作。
<agm-map [latitude]="signageRequest.gpsXcoordinate" [clickableIcons]="gpsXcoordinateStatus.readonly" [mapDraggable]="!gpsXcoordinateStatus.readonly"
[longitude]="signageRequest.gpsYcoordinate" [zoom]="zoom" [disableDefaultUI]=false [zoomControl]=false (mapClick)="mapClicked($event)"
[usePanning]="true">
<agm-marker [latitude]="signageRequest.gpsXcoordinate" [longitude]="signageRequest.gpsYcoordinate" [markerDraggable]="false"
(dragEnd)="markerDragEnd(marker, $event)"></agm-marker>
</agm-map>
也许有点晚了。我遇到了同样的问题。
<agm-map [latitude]="latitude" [longitude]="longitude">
<agm-marker [latitude]="latitude" [longitude]="longitude"></agm-marker>
你的.ts:
latitude: number = 21.4949494;
longitude: number = 101.49834;
那些变量 必须是数字而不是字符串。 使用 parseFloat 来解决这个问题。
我正在使用 AGM(angular google 地图) 来制作地图。我放了一个 getCurrentLocation 按钮,其中 returns 我当前位置的纬度和经度。我能够将标记更新到那个地方,但我的地图没有导航到那个特定位置。这是我的示例代码。
getCurrentLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition((response) => {
this.setPosition(response);
}, function () {
alert("Unable to get the GPS location");
}, { maximumAge: 60000, timeout: 5000, enableHighAccuracy: true });
};
}
这是我的 setPosition 方法
setPosition(position: Position) {
this.marker.lat = position.coords.latitude;
this.marker.lng = position.coords.longitude;
//What to do here to move screen to this marker position
}
这是更新标记后的屏幕。标记丢失。谢谢
您可以向 agm-map
组件提供纬度和经度,使地图以该坐标为中心。
<agm-map [latitude]="latitude" [longitude]="longitude">
<agm-marker [latitude]="latitude" [longitude]="longitude"></agm-marker>
</agm-map>
以上示例使地图围绕标记居中。
来自API docs:
latitude
: 定义地图中心的纬度。longitude
: 定义地图中心的经度。
我能够找出问题所在。基本上问题是我用不同的变量映射 'agm-marker' 和 'agm-map' [纬度] 和 [经度]。因此,一旦我开始使用相同的变量对其进行映射,它就开始正常工作。
<agm-map [latitude]="signageRequest.gpsXcoordinate" [clickableIcons]="gpsXcoordinateStatus.readonly" [mapDraggable]="!gpsXcoordinateStatus.readonly"
[longitude]="signageRequest.gpsYcoordinate" [zoom]="zoom" [disableDefaultUI]=false [zoomControl]=false (mapClick)="mapClicked($event)"
[usePanning]="true">
<agm-marker [latitude]="signageRequest.gpsXcoordinate" [longitude]="signageRequest.gpsYcoordinate" [markerDraggable]="false"
(dragEnd)="markerDragEnd(marker, $event)"></agm-marker>
</agm-map>
也许有点晚了。我遇到了同样的问题。
<agm-map [latitude]="latitude" [longitude]="longitude">
<agm-marker [latitude]="latitude" [longitude]="longitude"></agm-marker>
你的.ts:
latitude: number = 21.4949494;
longitude: number = 101.49834;
那些变量 必须是数字而不是字符串。 使用 parseFloat 来解决这个问题。