javascript - 如何获取经纬度地理定位坐标？

Question

我有应用程序通过纬度和经度坐标显示您当前的位置并显示在 map 上。在此应用程序中还具有显示表示景点的标记的功能。这些标记是我使用纬度和经度坐标从 api wiki 获得的。 但问题是，目前的坐标是完全静态的，必须自己写入代码中。如何从第三方服务动态获取经纬度？例如，来自JSON IP API

当前负责检索数据的代码

app.factory('places', ['$http', function($http) {

    return $http.jsonp('https://en.wikipedia.org/w/api.php?action=query&list=geosearch&gsradius=5000&gscoord=' + 43.1056 + '%7C' + 131.8735 + '&gslimit=30&format=json&callback=JSON_CALLBACK')
        .success(function(data) {
            return data
        })
        .error(function(err) {
            return err
        })

}])

我试图做到这一点

app.factory('places', ['$http', '$scope', function($http, $scope) {

  $scope.coordinates = {};
  $http.get('http://ip-api.com/json')
    .success(function(data) {
      $scope.coordinates.lat = data.lat;
      $scope.coordinates.lon = data.lon;
    });

    return $http.jsonp('https://en.wikipedia.org/w/api.php?action=query&list=geosearch&gsradius=5000&gscoord=' + coordinates.lat + '%7C' + coordinates.lon + '&gslimit=30&format=json&callback=JSON_CALLBACK')
        .success(function(data) {
            return data
        })
        .error(function(err) {
            return err
        })

}])

和

app.factory('places', ['$http', function($http) {

  $http.get('http://ip-api.com/json')
    .success(function(coordinates) {
         return $http.jsonp('https://en.wikipedia.org/w/api.php?action=query&list=geosearch&gsradius=5000&gscoord=' + coordinates.lat + '%7C' + coordinates.lon + '&gslimit=30&format=json&callback=JSON_CALLBACK')
                .success(function(data) {
                    return data
                })
                .error(function(err) {
                    return err
                })
    });

}])

但它不起作用。你能帮我解决这个问题吗？ 如果您需要查看应用程序的完整代码，您可以在这里下载https://www.dropbox.com/s/qiu91hhdrc0qy5o/GeoApp.rar?dl=0

Answer 1

您可以使用浏览器的HTML5功能，只需编写一个函数即可获取当前坐标:

var deferred;

$scope.currentPosition = function() {
    deferred = $q.defer();

    if (window.navigator && window.navigator.geolocation) {
        window.navigator.geolocation.getCurrentPosition(currentPosition, handleErrorOnTrackCurrentPosition);
    } else {
        deferred.reject({msg: "Browser does not supports HTML5 geolocation"});
    }
    return deferred.promise;
};

function currentPosition(position) {
    deferred.resolve({latitude: position.coords.latitude, longitude: position.coords.longitude});
}

function handleError(error) {
    deferred.reject({msg: error.message});
}

现在，当您想获取当前坐标时，只需编写:

$scope.currentPosition().then(function(data) {
    console.log(data.latitude, data.longitude);
});