Google Map Adds Token Using Location ID

Question

I am trying to place a marker on Google Maps using its PlaceID. I have a map that works and is displayed, and I can also add markers to it (using latitude and longitude).

The code below is what I use to try to make the marker show using its placeID, but it does not display.

function addPlaces(){ var marker = new google.maps.Marker({ place: new google.maps.Place('ChIJN1t_tDeuEmsRUsoyG83frY4'), map: map }); } 

This function is called after loading the map.

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

Answer 1

If you want to place a marker on the map in place with place_id: 'ChIJN1t_tDeuEmsRUsoyG83frY4', you need to make a getDetails request in PlaceService

 var service = new google.maps.places.PlacesService(map); service.getDetails({ placeId: 'ChIJN1t_tDeuEmsRUsoyG83frY4' }, function (result, status) { var marker = new google.maps.Marker({ map: map, place: { placeId: 'ChIJN1t_tDeuEmsRUsoyG83frY4', location: result.geometry.location } }); }); 

proof of conceptual scripts

code snippet:

 var map; var infoWindow; var service; function initialize() { var mapOptions = { zoom: 19, center: new google.maps.LatLng(51.257195, 3.716563) }; map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); infoWindow = new google.maps.InfoWindow(); var service = new google.maps.places.PlacesService(map); service.getDetails({ placeId: 'ChIJN1t_tDeuEmsRUsoyG83frY4' }, function(result, status) { if (status != google.maps.places.PlacesServiceStatus.OK) { alert(status); return; } var marker = new google.maps.Marker({ map: map, position: result.geometry.location }); var address = result.adr_address; var newAddr = address.split("</span>,"); infoWindow.setContent(result.name + "<br>" + newAddr[0] + "<br>" + newAddr[1] + "<br>" + newAddr[2]); infoWindow.open(map, 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?v=3&libraries=places"></script> <div id="map-canvas"></div>