Enhancing Salesforce Data Visualization with Interactive Maps and Metrics

Have you ever wished you could present Salesforce data in a way that truly captivates your users? We all know the feeling: while functional, standard reports and related lists often fall flat when grabbing attention and driving action. Custom LWCs or CRM Analytics might offer a solution, but their complexity can be a barrier.

Today, we're unveiling a practical solution: a blend of Flow Builder's flexibility and Avonni's innovative components to create dynamic, interactive visualizations that rival the best consumer apps.

Building an Interactive Map

We aim to create a dynamic map experience directly within a Salesforce screen flow. This map will respond instantly to user interactions, filtering data and updating metrics as they explore. Locations will seamlessly appear and disappear, keeping the map in sync with their movements. This approach results in a fast, engaging user experience that efficiently loads data based on the user's specific focus area.

Metrics: Eye-Catching and Dynamic

At the top, Avonni's Metrics components showcase key location data—total count and breakdowns by type. More than just numbers, these metrics react in real-time to map interactions, creating an interactive experience that rivals top consumer apps.

The Map: A Reactive Visualization

Our map is the core of the solution: reactive and performant. It dynamically updates markers and metrics with every pan or zoom, creating a seamless user experience.

Why Screen Flows?

You might wonder, "Why use a Screen Flow for this? Aren't they mainly for guiding users through processes?"

Screen Flows are often seen as tools for multi-step interactions and data collection. But they also offer surprising flexibility and ease of use, making them a compelling alternative to custom Lightning Web Components in specific scenarios.

In our case, we chose Screen Flows because we wanted a solution that's:

• Flexible: Easily adaptable to changing requirements or new features.
• Maintainable: Simple to update without extensive coding knowledge.
• Accessible: Empowering admins and business users to make changes.

By building this interactive map within a Screen Flow, we can balance powerful functionality and ease of maintenance.

Flow Structure: Keeping it Simple and Focused

The structure of our flow is intentionally simple, mirroring the primary goal of showcasing the interactive map. It consists of a single screen as a canvas for the map and accompanying metrics. This streamlined design avoids unnecessary complexity, ensuring the focus remains on the visual experience and data exploration.

Under the Hood: Dynamic Formulas in Action

The secret to our interactive map's responsiveness lies in dynamic formulas. These formulas act as a real-time filter, constantly evaluating key map attributes like the center point and visible area. This ensures that the Avonni Map component's query only fetches and displays locations relevant to the user's current view. This dynamic filtering makes the map come alive, responding instantly to pans and zooms, delivering a smooth and efficient experience even with large datasets.

Breaking Down the Formula

Let's take a closer look at the formula that makes this all possible:

DISTANCE(Location__c, GEOLOCATION("&{!map.centerLatitude}&","&{!map.centerLongitude}&"), 'km') <"&TEXT({!map.visibleWidthKm})        

In essence, this formula:

1. Calculate the distance: It measures the distance (in kilometers) between each location record's Location__c field (Geolocation field type) – which must contain geolocation data – and the current center point of the map, as pinpointed by {!map.centerLatitude} and {!map.centerLongitude}.
2. Compare to visible area: It then checks if this calculated distance is less than the width of the currently visible map area, represented by {!map.visibleWidthKm}.
3. Filter based on the result: If the distance is less than the visible width, the location is included in the map display; otherwise, it's filtered out.

This simple yet powerful formula ensures that the map only shows locations within the user's current view, creating a dynamic and performant experience.

NOTE

• To make this work, choose "Leaflet" as your map type in the Avonni Map component settings.
• Also, double-check that each record you want to show on the map has latitude and longitude values stored in its geolocation field.

For the Metrics: Fine-Tuning the Filter

Our metrics component also harnesses the power of dynamic formulas, but with a refined focus. We extend the same core logic from the map, adding an extra filtering layer to zero in on specific categories. These dynamic formulas act as filters within the metrics component's query, ensuring the displayed counts accurately reflect the data visible on the map at any given moment.

Let's look at the formula used for the metrics:

DISTANCE(Location__c, GEOLOCATION("&{!map.centerLatitude}&","&{!map.centerLongitude}&"), 'km') <"&TEXT({!map.visibleWidthKm}) & " AND Type__c = 'Bakery'"        

This formula is the same as the one used for the map, with one key addition: AND Type__c = 'Bakery'. This extra condition ensures that the metric only counts locations that are both:

1. Within the visible map area (based on the distance calculation).
2. Classified as a "Bakery" (based on the Type__c field).

Using this formula as a filter in the metrics component's query gives us a real-time count of bakeries within the user's current view. This allows us to display dynamic, context-aware metrics that enhance the user's understanding of the data.

Today, we've demonstrated how to elevate your Salesforce user experience by creating dynamic, interactive maps within Flow Builder.

Remember, the key takeaways are:

• Think beyond the basics: Salesforce offers many possibilities beyond standard reports and dashboards.
• Embrace the power of flows: Flow Builder is more than just a process automation tool; it's a platform for creating rich, interactive user experiences.
• Leverage innovative components: Avonni's components, like the Map and Metrics, provide essential building blocks for crafting engaging visualizations.
• Don't be afraid to experiment: Dynamic formulas and creative thinking can unlock new levels of interactivity and insight.

This is just one example of what you can achieve. The possibilities are endless!

So, start exploring, experimenting, and pushing the boundaries of what's possible in Salesforce. Your users will thank you for it.

Now, it's your turn!

• We want to hear from you: Have you used Flow Builder and Avonni components in creative ways? Share your experiences and tips in the comments below!
• Stay connected: Don't miss our next issue, "The Flow Must Go On!" We'll explore another exciting use case. Subscribe now to fuel your flow mastery!