HeIIo, using google map API with search I'm able to find a certain place and then store it's details. However, the array doesn't contain google maps link which would open this place on google maps.
Via API I receive place_id which, as I feel, should be enough to build a full google maps link; however, I can't find a way to do that. Can anyone advise me on how to do that.
Thank you for your time.
Try below syntax. I hope it helps
https://www.google.com/maps/place/?q=place_id:ChIJp4JiUCNP0xQR1JaSjpW_Hms
Here is an official url to search for a placeId
with a fallback to an address
if the placeId
does not exist
https://www.google.com/maps/search/?api=1&query=<address>&query_place_id=<placeId>
no token required, works on Android, iOS (as well as iOS 11) and web
There is a way of always getting the right URL but it does require an additional request.
You can use the place_id to get the place details with https://maps.googleapis.com/maps/api/place/details/json?key=YOURAPIKEY&placeid=THEPLACEID
The response from that has a ['result']['url'] field which always opens up the right place. eg. https://maps.google.com/?cid=10254754059248426663
There is no documentation for the expected parameters on https://www.google.com/maps/place , so this may only be a workaround(at least it currently works for me).
The following URL-format seems to give the desired result in most cases:
https://www.google.com/maps/place/[place-name]/@[latitude],[longitude],[zoom]z/
You may create this URL based on the place-name and the place-geometry
function initialize() { var ac = new google.maps.places.Autocomplete(document.getElementById('pac')); google.maps.event.addListener(ac, 'place_changed', function() { var place = this.getPlace(), link = document.getElementById('link'); if (!place.geometry) { link.textContent = ''; } else { var zoom = 17, url = 'https://www.google.com/maps/place/' + encodeURIComponent(place.name) + '/@' + place.geometry.location.toUrlValue() + ',' + zoom + 'z/'; link.href = link.textContent = url; } }); } google.maps.event.addDomListener(window, 'load', initialize);
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&libraries=places"> </script> <input id="pac" /> <br/> <a id="link" href="" target="_blank"></a>
You can use google embed API, and take src as a link: eg:
https://www.google.com/maps/embed/v1/place?key=YOUR_API_KEY
&q=place_id:YOUR_PLACE_ID
Docs: https://developers.google.com/maps/documentation/embed/guide#place_mode
You can use google embed API, and take src as a link: eg:
What worked for me without place_id
https://www.google.com/maps/search/<search term>/@<coordinates>,<zoom level>z
Example
https://www.google.com/maps/search/Jouvay+Night+Club/@40.6961111,-73.8041667,15z
I had the same problem with an iOS app redirecting users to the desired place (returned from nearbysearch
API) in google maps.
They mentioned above:
https://www.google.com/maps/place/?q=place_id:ChIJp4JiUCNP0xQR1JaSjpW_Hms
If you open this link in your browser, it will show a place on the google map website.
But if you try to open this link on a mobile phone, it will open the google map application instead (if it exists on the user's phone) and not redirect to safari. Also, the google map application doesn't show the place ( that link will work on the browser only ).
After testing many ways for creating a link to work both in the google map application and browser, the best way is to show a place is just passing location
and place_id
within the link.
let url = "https://www.google.com/maps/search/?api=1&query=\(placeLatitude)%2C\(placeLongitude)&query_place_id=\(placeId)"
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.