Google Maps Geocode意外属性位置

Question

我正在尝试为我的vue.js应用程序设置地理编码。我不使用任何第三方库，只有通过NPM安装的Google地图。

调用GeoCode方法时，会出现一个错误，说属性位置是出乎意料的。我尝试了"位置"，" latlng"，坐标自身等等。经度和纬度来自navigator.geolocation对象。

这是我的设置标记的一部分：

Vue.component('catalog', require('./components/Catalog'));
Vue.component('address-autocomplete', require('./components/AddressAutoComplete'));
window.googleMapsClient = require('@google/maps').createClient({
    key: "MY_API_KEY"
});

和我的vue-component：

getLocationFromGeoData() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(
            this.setLocation,
            this.showError
        );
    } else {
        showLocationError("Geolocation wird nicht unterstützt!");
    }
},
setLocation(position) {
    var self = this;
    this.location.latitude = position.coords.latitude;
    this.location.longitude = position.coords.longitude;
    var latLng = {
        lat: parseFloat(this.location.latitude),
        lng: parseFloat(this.location.longitude)
    };
    googleMapsClient.geocode({'location': latLng}).asPromise()
        .then((response) => {
            self.location.address = results[1].formatted_address;
        }).catch((err) => {
            showLocationError(err);
        });
},

Answer 1

请注意，您尝试解决地址的坐标。此过程通常称为反向地理编码。这意味着您必须使用.reverseGeocode(query, callback)方法而不是.geocode(query, callback)方法。

您的代码应更改为类似于

的东西

var latLng = {
    lat: parseFloat(this.location.latitude),
    lng: parseFloat(this.location.longitude)
};
googleMapsClient.reverseGeocode({'latlng': latLng}).asPromise()
    .then((response) => {
        self.location.address = results[1].formatted_address;
    }).catch((err) => {
        showLocationError(err);
    });

有关更多详细信息，请查看

node.js的地图Web服务客户库的文档

https://googlemaps.github.io/google-maps-services-services-js/docs/googlemapsclient.html

我希望这会有所帮助！

Answer 2

geocode是类google.maps.Geocoder的方法-https：//developers.google.com/maps/documentation/javascript/geocoding。

const geocoder = new google.maps.Geocoder;
geocoder.geocode({'location': latlng}, function(results, status) { // code