中心谷歌地圖上的地方標識沒有指定經緯度？

Question

如何在基於placeID的Google地圖中居中，而不是在地圖對象中明確設置lat和lng？

我見過的所有例子都有一個值集，例如

var pyrmont = new google.maps.LatLng(-33.8665433,151.1956316); 

^{形式：developers.google.com}

當然，你可以基於ID的地方getDetails，然後用緯度和經度將地圖？

function initializeGoogleMaps() { 
    jQuery('.site-content').prepend('<div id=\"map-container\"><div id=\"map-canvas\"></div></div>'); 

    var request = { 
    placeId: 'ChIJzXBGLkQFdkgRoyT2MIxgWGw' 
    }; 

    function callback(place, status) { 
    if (status == google.maps.places.PlacesServiceStatus.OK) { 
     var marker = new google.maps.Marker({ 
     map: map, 
     position: place.geometry.location 
     }); 
    } 
    } 

    var map = new google.maps.Map(document.getElementById('map-canvas'), { 
    center: { 
     lat: 51.509526, 
     lng: -0.156314 
    }, 
    zoom: 15 
    }); 

    service = new google.maps.places.PlacesService(map); 
    service.getDetails(request, callback); 
} 

Answer 1

您可以設置使用從地方服務返回的值地圖的中心（或標記的位置）：

proof of concept fiddle

function callback(place, status) { 
    if (status == google.maps.places.PlacesServiceStatus.OK) { 
     var marker = new google.maps.Marker({ 
     map: map, 
     position: place.geometry.location 
     }); 
     map.setCenter(marker.getPosition()); 
    } 
    } 

    var map = new google.maps.Map(document.getElementById('map-canvas'), { 
    zoom: 15 
    }); 

代碼片段：

function initializeGoogleMaps() { 
 
    var request = { 
 
    placeId: 'ChIJzXBGLkQFdkgRoyT2MIxgWGw' 
 
    }; 
 

 
    function callback(place, status) { 
 
    if (status == google.maps.places.PlacesServiceStatus.OK) { 
 
     var marker = new google.maps.Marker({ 
 
     map: map, 
 
     position: place.geometry.location 
 
     }); 
 
     map.setCenter(marker.getPosition()); 
 
    } 
 
    } 
 

 
    var map = new google.maps.Map(document.getElementById('map-canvas'), { 
 
    zoom: 15 
 
    }); 
 

 
    service = new google.maps.places.PlacesService(map); 
 
    service.getDetails(request, callback); 
 
} 
 
google.maps.event.addDomListener(window, 'load', initializeGoogleMaps);

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>