Loading...
New Awarded Winner – IT & Development | Payoneer India 2026 Check out
Featured Recognized by Salesforce; Proven by impact! Check out

Understanding customers and running a smooth business are two of the major specialties of Salesforce. When the sales and marketing team faced challenges in assigning territories, finding nearby prospects, campaigning on a particular location and more such geolocation activities, Salesforce unlocked a whole new way into this world of navigation.

Winter 19 introduced many components including lightning:map which is very useful for developers. Before lightning:map, the developers needed Google API key and lots of script to show address on the Google Map. The lightning:map component displays a map of one or more locations using Google Maps securely.

This component requires API version 44.0, making it easy to display the user location in the UI. There is no need to use external JavaScript libraries anymore. Developers can use markers in the component to define location on the map wherein the marker could be a pair of coordinates (latitude and longitudes), or a set of address elements such as Street, City, State, Country or Postal Code.

Steps involved in the overall Setup:

  • API setup on Google G-suite account
  • Develop Apex classes
  • Develop Lightning Component

API SETUP:

  • We need to have Google Developer account where we will be creating a Project.
  • We need to have Places API enabled.
  • The API documentation to setup the API on Google is – API documentation

For Live Demo Click Here

Step 1- Create Apex Wrapper Class

Step 2- Create an Apex Class Controller:

Step 3 – Create Lightning Component

Step 4 – JS Controller

Step 5- lightning App

Conclusion:

Above is the implementation of the lightning component enabling us to find the distance between two zip codes using Google API. We have used wrapper classes to send data to the map component. The location wrapper is used to store the address while the address wrapper is used to provide marker specific details.

If you need further assistance or have any queries to make your Salesforce classic apps compatible with lightning experience, please feel free reach out.

Happy Learning!

Related Articles

Sticky notes aren’t just for your desk anymore! In this tutorial, we’ll create a Lightning Web Component (LWC) in Salesforce that allows you to pin notes on your app page or record page. With a clean, interactive UI, these digital sticky notes ensure you never forget important tasks or details. What Will You Learn? By […]

Read More
How to Create Dynamic, Animated Charts in Salesforce LWC using Chart.js

Bring Salesforce data to life with dynamic charts inside Lightning pages! While Salesforce dashboards are powerful, sometimes business users want visual insights without leaving their current page. That’s where Chart.js with Lightning Web Components (LWC) becomes a game-changer. In this step-by-step guide, you’ll learn how to: Upload Chart.js as a static resource in Salesforce. Build […]

Read More
How to Encrypt and Decrypt Data in Salesforce Using Apex Crypto Class

Data security is more important than ever. Whether you’re storing customer information, sensitive business data, or private communication, ensuring that your data stays safe is critical. Salesforce provides built-in tools to help with this, and one of the most powerful yet easy-to-use approaches is encryption and decryption using the Apex Crypto class. In this blog, […]

Read More
Benefits & Step-by-Step Setup Guide for Salesforce Code Analyzer

When building on the Salesforce platform, code quality and security are non-negotiable, especially before submitting your app for a Salesforce Security Review. Catching bugs and vulnerabilities early not only saves time but also ensures compliance with Salesforce’s best practices. That’s where the Salesforce Code Analyzer comes in. This open-source tool scans your Apex classes, triggers, […]

Read More
A Step-by-Step Guide to Integrate Zoho CRM with Salesforce (Without Coding)

Managing data across multiple CRMs can be a real challenge for businesses that want a single source of truth. If your teams use Zoho CRM but want to move or sync all records seamlessly into Salesforce, you don’t need to write a single line of code. Thanks to MultiSync Made Easy, the integration process is […]

Read More
How to Integrate Salesforce with Copilot

Integrating Salesforce with Copilot is becoming an essential step for organizations aiming to streamline workflows, automate client data management, and unlock the power of AI-driven CRM. By connecting these two platforms, businesses can centralize customer information, reduce manual tasks, and accelerate growth. This guide walks you through the Salesforce–Copilot integration process with clear steps, Apex […]

Read More