javascriptgoogle-mapsgoogle-maps-api-3google-maps-advanced-marker-element

Using PlaceId's with Advanced Markers


Using legacy markers you could add markers using placeId's like

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
        }
    });
})

Is it possible to do the same with AdvancedMarkers? Trying to do the same above google.maps.marker.AdvancedMarkerElement({...}) throws a invalidValueError.


Solution

  • The result from service.getDetails contains a lat lng object in result.geometry.location. You can place the marker with something like this:

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