Distance Settings in the Locations Vertical

How can I customize the metric that we use for measuring distance in the locations vertical of an Answers experience for results displayed for queries like “facilities near me”?

Looks like our default is to measure distance in miles and a client of mine would like this to be updated to kilometers. Guessing this is controlled in the mapConfig. Any guidance would be greatly appreciated.

Thanks!

Hi Emmy,

If you look at the card config for the location-standard, card, you’ll see that the distance is set by a formatter.

distance: Formatter.toMiles(profile), // Distance from the user’s or inputted location

To see available formatters, you can search your theme’s Formatters.js file. There, you’ll find the following formatter:

  static toKilometers(profile, key = 'd_distance', displayUnits = 'km') {
    if (!profile[key]) {
      return '';
    }
    const distanceInKilometers = profile[key] / 1000; // Convert meters to kilometers
    return distanceInKilometers.toFixed(1) + ' ' + displayUnits;
  }

Simply use this formatter in your distance attribute on your card’s JS mappings, and you’ll be good to go!

2 Likes