How to geocode in Lightning?

Question

Anyone know if its possible to use the google geocoder API from a Lightning component?

Using visual force and javascript I have can make use of google maps goecoder API to get the geolocation of addresses.

So in Visualforce and javascript I import the google maps api JS library like so...

<script src="https://maps.googleapis.com/maps/api/js"></script>

And then later on I make use of the google geocoder...

var geocoder = new google.maps.Geocoder();
geocoder.geocode( {'address': address }, function(results, status) {
  response(
      /* code to handle the geocoder response */
  }));

But it appears I can't do use the same technique in a Lightning component as Lightning forces you to use <lntg:require> and you are limited to static resources. I can't find a way to make the google maps api js work as a static resource, mainly because it imports other javascript.

Kind regards

David Smith

Answer 1

First of all, you can save an external JS in static resource and import it in lightning component using ltng:require tag. Just go to your google map api link, Save the page as .js file and upload it as static resource.

Having said that, there is some limitation from Salesforce side to use Google JS APIs in lightning components. I have an ongoing case with Salesforce for this and they are also not sure of any alternatives.

If you are open to make use of any other mapping services(OpenStreetMap, ArcGIS etc) you can use Leaflet JS library. Its very well documented here. Here is an implementation guide. Leaflet JS allows you to call mapping services and use their responses to create map UI of their own.