How NOT to add Google Maps to a Lightning Component!

This post about how you can create a Google Maps like Map component inside a Lightning component but without using Google Maps.

Wait You Said Google Maps in Lightning?

It would be awesome if you could embed Google Maps in a Lightning component and there are lots of posts that show how to do it, but if you look at them you’ll see they all use an iframe to embed it. The reason they need to use an iframe is because the Google Maps JS api has to be used from their servers. There’s no way in Lightning to use a JS library like that.

Now you maybe thinking… “well why not download it and upload it as a Static Resource?”. You can, but it’s not so simple because of the way Google dynamically generates/downloads the files.

What options are there then?

Well thankfully Google Maps isn’t the ONLY map solution available. Instead you can use a library called Leaflet.js.

Leaflet
Leaflet

Continue reading “How NOT to add Google Maps to a Lightning Component!”