Jakar Jakar - 1 year ago 164
HTML Question

Embed google map using share url

Say, you go to google maps and search for 'Walmart', then choose the first Walmart in the list, and you get a URL like:


then if you go to that URL, it gives you a valid map with the pinpoint. This (above) is the URL that would be stored in my database, thus the URL I want to use to embed a map.

Of course, I can't use that URL to embed in an iframe, and I instead have to use:

So... for any shareable Google Maps url, how can I convert it to an embeddable url to be used as the iframe

I can do it server-side using PHP or client-side with javascript. use of regex would be acceptable.

Answer Source

This could do the trick :

$matches = [];


$place = $matches[1];


$lat = $matches[1];
$long = $matches[2];

echo '<iframe src="https://www.google.com/maps/embed/v1/place?q='.$place.'&center='.$lat.','.$long.'&key=AIzaSyAN0om9mFmy1QN6Wf54tXAowK4eT0ZUPrU&zoom=8" frameborder="0"></iframe>';

After the first @ char it is located the latitude and logitude, which you can extract using the regex I wrote, and than capture the output on 2 groups and add it that on the embedd URL.