Google Maps API - 水の本体名を取得

Question

Googleマップのapiから水の本体名を取得するにはどうすればよいですか？ たとえば、マップをクリックすると、「ここには何がありますか」が選択されます。ポップアップに湖の名前と座標が表示されます。私はその名前が必要です。

Answer 1

ミシガン湖はPlaces APIの座標にあります。しかし、 "名前は"ミシガン湖/ミシガンシティ "です。

コードスニペット：

var map; 
 
var infowindow; 
 
var service; 
 

 
function initialize() { 
 
    map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     center: new google.maps.LatLng(43.4501005, -87.2220187), 
 
     zoom: 8, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    infowindow = new google.maps.InfoWindow(); 
 
    service = new google.maps.places.PlacesService(map); 
 
    service.nearbySearch({ 
 
    location: map.getCenter(), 
 
    radius: 500 
 
    }, callback); 
 
} 
 

 
function callback(results, status) { 
 
    if (status === google.maps.places.PlacesServiceStatus.OK) { 
 
    console.log("OK:" + results.length) 
 
    for (var i = 0; i < results.length; i++) { 
 
     console.log(results[i]); 
 
     var marker = createMarker(results[i]); 
 
     if (i == 0) google.maps.event.trigger(marker, 'click'); 
 
    } 
 
    } 
 
} 
 

 
function createMarker(place) { 
 
    var placeLoc = place.geometry.location; 
 
    var marker = new google.maps.Marker({ 
 
    map: map, 
 
    position: place.geometry.location 
 
    }); 
 

 
    google.maps.event.addListener(marker, 'click', function() { 
 
    infowindow.setContent(place.name + "<br>place_id:" + place.place_id); 
 
    infowindow.open(map, this); 
 
    service.getDetails({ 
 
     placeId: place.place_id 
 
    }, function(place, status) { 
 
     if (status === google.maps.places.PlacesServiceStatus.OK) { 
 
     google.maps.event.addListener(marker, 'click', function() { 
 
      infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + 
 
      'Place ID: ' + place.place_id + '<br>' + 
 
      place.formatted_address + '</div>'); 
 
      infowindow.open(map, this); 
 
     }); 
 
     google.maps.event.trigger(marker, 'click'); 
 
     } 
 
    }); 
 
    }); 
 
    return marker; 
 
} 
 

 
google.maps.event.addDomListener(window, "load", initialize);

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

<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script> 
 
<div id="map_canvas"></div>