Google Maps API: Геокодер: неизвестная функция свойства:

#javascript #html #google-maps #google-maps-api-3

#javascript #HTML #google-карты #google-maps-api-3

Вопрос:

В настоящее время я пытаюсь использовать Google Geocoder API для преобразования адреса в координаты Lat / Lng, однако при использовании примера в их документации по разработке (https://developers.google.com/maps/documentation/javascript/geocoding ), я сталкиваюсь с ошибкой «InvalidValueError: неизвестная функция свойства».

В моем HTML-файле у меня есть вызов Google map API и map div, где должна отображаться моя карта. (конечно, у меня есть и другие вещи, но просто ради того, чтобы сразу перейти к делу, я опубликую только соответствующий код)

 <script src="https://maps.googleapis.com/maps/api/js?key=APIKEYamp;callback=initMap" async defer></script>
<div id="map"></div>
  

И в моем JS-файле:

 window.initMap = function(){
var fromLocation = new google.maps.LatLng(37.09024, -95.712891),
  destLocation = new google.maps.LatLng(37.09024, -95.712891),
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: 37.09024 , lng: -95.712891}, // center of USA
    zoom: 4 // continet level
  }),
  directionService = new google.maps.DirectionsService(),
  directionRender = new google.maps.DirectionsRenderer({
    map: map
  }),
  markerA = new google.maps.Marker({
    position: fromLocation,
    title: "Point A",
    label: "From",
    map:map
  }),
  markerB = new google.maps.Marker({
    position: destLocation,
    title: "Point B",
    label:"Destination",
    map:map
  });
   getLatLng("Los Angeles");
 } // end of initMap

 function getLatLng(address){
   geocoder = new google.maps.Geocoder();
   geocoder.geocode({address: address, function(results,status){
    if(status === 'OK'){
      console.log(results[0].geometry.location);
    }
    else{
      console.log("Geocoding couldn't convert string address to lat/long points");
    }
  }
 });// end of geocoder method.
}
  

Есть идеи о том, как исправить ошибку неизвестной функции свойства?
Спасибо!

Ответ №1:

У вас опечатка в функции getLatLng :

 geocoder.geocode({
  address: address,
  

После должно быть «}» address: address

 function getLatLng(address) {
  geocoder = new google.maps.Geocoder();
  geocoder.geocode({
    address: address},
    function(results, status) {
      if (status === 'OK') {
        console.log(results[0].geometry.location);
      } else {
        console.log("Geocoding couldn't convert string address to lat/long points");
      }
  }); // end of geocoder method.
}
  

 window.initMap = function() {
    var fromLocation = new google.maps.LatLng(37.09024, -95.712891),
      destLocation = new google.maps.LatLng(37.09024, -95.712891),
      map = new google.maps.Map(document.getElementById('map'), {
        center: {
          lat: 37.09024,
          lng: -95.712891
        }, // center of USA
        zoom: 4 // continet level
      }),
      directionService = new google.maps.DirectionsService(),
      directionRender = new google.maps.DirectionsRenderer({
        map: map
      }),
      markerA = new google.maps.Marker({
        position: fromLocation,
        title: "Point A",
        label: "From",
        map: map
      }),
      markerB = new google.maps.Marker({
        position: destLocation,
        title: "Point B",
        label: "Destination",
        map: map
      });
    getLatLng("Los Angeles");
  } // end of initMap

function getLatLng(address) {
  geocoder = new google.maps.Geocoder();
  geocoder.geocode({
      address: address
    },
    function(results, status) {
      if (status === 'OK') {
        console.log(results[0].geometry.location);
      } else {
        console.log("Geocoding couldn't convert string address to lat/long points");
      }
    }); // end of geocoder method.
}  
 html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}  
 <script src="https://maps.googleapis.com/maps/api/js?callback=initMap" async defer></script>
<div id="map"></div>