Google地圖標記未在確切位置顯示

Question

在我的項目中，我已經集成了Google地圖。 我遇到一個問題：搜索特定位置時，標記未顯示在當前點，而是顯示在其他位置。 但是，經度和緯度是正確的，您能幫我了解我所缺少的嗎？

注意： 對於某些位置，標記會顯示在正確的位置。

HTML代碼：

<input ng-model="address" class="form-control" ng-map-autocomplete/>
<ng-map zoom="18" center="{{address}}" style="width:650px; height:450px">
    <marker position="{{address}}" title="{{address}}"  draggable="true"></marker>
</ng-map>

控制器：

$scope.$watch(function ($scope) { return $scope.chosenPlaceDetails }, function () {
    if (angular.isDefined($scope.chosenPlaceDetails )) {
        $scope.latitude= $scope.chosenPlaceDetails.geometry.location.lat();
        $scope.longitude=$scope.chosenPlaceDetails.geometry.location.lng();
    }
});

Answer 1

根據Ng-map-autocomplete文檔，{{address}}僅是用於自動完成的值。 您可以附加一個“詳細信息”值，其中包含您所在位置的經度和緯度。

    <input type="text"  ng-map-autocomplete ng-model="autocomplete" options="options" details="details"/>

然后，在ng-map指令中，您可以訪問經緯度

<ng-map zoom="18" center="{{details.geometry.location.lat}},{{details.geometry.location.lng}}" style="width:650px; height:450px">
    <marker position="{{details.geometry.location.lat}},{{details.geometry.location.lng}}" title="{{address}}"  draggable="true"></marker>
</ng-map>

如果要在控制器中進行更新，可以在詳細信息上放置一個$ watcher

$scope.$watch('details', function (newValue, oldValue) {
if (oldValue == undefined){
  $scope.latitude = 0 /*default value */
  $scope.longitude= 0 /*default value */
}
 $scope.latitude= newValue.geometry.location.lat;
$scope.longitude=newValue.geometry.location.lng;
});

那么您可以使用新變量訪問ng-map指令中的位置。

<ng-map zoom="18" center="{{latitude}},{{longitude}}" style="width:650px; height:450px">
    <marker position="{{latitude}},{{longitude}}" title="{{address}}"  draggable="true"></marker>
</ng-map>

希望能幫助到你。 來源： https : //github.com/iazi/ngMapAutocomplete

附：代碼未經測試，我只是嘗試重新創建一個月前所做的工作