Google 地图 JavaScript API V3 - Geocoder API 未返回地名

Question

这是我的代码，我是 Google 地图和 JavaScript 的新手，我试图通过将位置 (latlng) 传递给地理编码器来获取 'Place Name'，但它没有 returning 任何值。如果将 placeName var 设置为 'somePlace'，则将标题设置为 'somePlace'。但我想用 return 值设置标题，即地名。

function setMap(position){
  //var Karachi = {lat: 24.8978176, lng: 66.9596003}; //default city
  var location = {
    lat: position.coords.latitude,
    lng: position.coords.longitude
  }

  var mapOptions = {

      center: location,
      zoom: 13,         //initial zoom level
      mapTypeId: 'hybrid'  //map type
  }
  //object of map
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);

  var placeName;
  //placeName = 'SomePlace'; 
  var newLatLng = location + '';
  var latlngStr = newLatLng.split(',',2);
  var latlng = {lat: parseFloat(latlngStr[0]), lng:    parseFloat(latlngStr[1])};
  var geocoder = new google.maps.Geocoder({'location': latlng}, function(results, status) {
    if(status === 'OK'){
      if(results[1]){
        placeName = 'results[1].formatted_address';
      }
      else{
        window.alert('Error in ' + status);
      }
    }
    else{
      window.alert('Geocoder failed due to ' + status);
    }
  });

  var markerOptions = {
    position: location,
    map: map,
    title: placeName //<-- i want place name to be here

  }
  //object of marker
  var marker = new google.maps.Marker(markerOptions);
  marker.setTitle(placeName); //<-- this is also not working
}

Answer 1

只需尝试将您的纬度和经度传递给以下查询字符串，您将得到一个 json 数组，从那里获取您的地名。

http://maps.googleapis.com/maps/api/geocode/json?latlng=44.4647452,7.3553838&sensor=true

Answer 2

您的代码中存在语法错误。

您需要调用 google.maps.Geocoder geocode method, with a valid GeocoderRequest 对象：

var geocoder = new google.maps.Geocoder();
  geocoder.geocode({
    location: location
  }, function(results, status)

Geocoder是异步的，需要在回调函数中使用返回结果when/where可用：

  if (results[1]) {
    placeName = results[1].formatted_address;
    var markerOptions = {
        position: location,
        map: map,
        title: placeName //<-- i want place name to be here

      }
      //object of marker
    var marker = new google.maps.Marker(markerOptions);

proof of concept fiddle

代码片段：

function setMap(position) {
  var location = {
    lat: position.coords.latitude,
    lng: position.coords.longitude
  }

  var mapOptions = {

    center: location,
    zoom: 13, //initial zoom level
    mapTypeId: 'hybrid' //map type
  }
  //object of map
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);

  var geocoder = new google.maps.Geocoder();
  geocoder.geocode({
    location: location
  }, function(results, status) {
    if (status === 'OK') {
      if (results[1]) {
        placeName = results[1].formatted_address;
        var markerOptions = {
          position: location,
          map: map,
          title: placeName // set formatted_address as title of marker
        }
        //object of marker
        var marker = new google.maps.Marker(markerOptions);
      } else {
        window.alert('Error in ' + status);
      }
    } else {
      window.alert('Geocoder failed due to ' + status);
    }
  });
}
google.maps.event.addDomListener(window, "load", function() {
  setMap({
    coords: {
      latitude: 37.4419,
      longitude: -122.1419
    }
  })
});

html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>

Google 地图 JavaScript API V3 - Geocoder API 未返回地名

Google Maps JavaScript API V3 - Geocoder API is not returning place name

javascript

google-maps-api-3

google-maps-markers

reverse-geocoding

google-geocoding-api