1. Home
  2. Tutorials
  3. Using Native Functionality
  4. Find the Closest Location in an API Array

Find the Closest Location in an API Array

closest ios
If you have an API request in your app that returns an array of locations, you can determine which one is closest to the user’s current location. With the API request returning the location array in a page:

  1. Track the user location.
    • In Page Variables on the right, add a new variable, naming it e.g. “user_location” and choosing Core Location > CLLocationManager type. location manager
    • Add the Request Location Authorization Action to an Event such as the page appearing, selecting the Location Manager variable.

    • Decide if you want continuous location updates or just a single update.
      • For continuous updates, add an Action, for example to the page Appeared Event, selecting Start Tracking Location, selecting the Location Manager variable. start tracking closest
      • For a single update, add an Action that will execute before you run your API request, choosing Request Location Update. Select the Location Manager variable. single closest update
  2. Add another two Page Variables, naming them “distance” and “closest”, with Double type. closest ios You should now have three new Page Variables.
  3. Add an Action that will execute before your API request runs, choosing Set Value. Set the closest variable to a number that will be higher than the distance between the user and any location, such as 20000 if you plan to use kilometers in your distance calculation. initial closest
  4. Open the request in the API tab on the right of the editor. Open the Events and choose the 200: OK Event (providing it’s associated with the array of locations). Add an Iterate through Array Action. Select the array from the response using the Event Data. ios closest array
  5. In the nested Item Event, add a Create a Location Object Action. Select the latitude and longitude for the current array entry via the Event Data. create location closest
  6. Still in the Item Event, add the Calculate Distance Action. Select the user_location variable Location property, the location returned from Create a Location Object via the Action Data, and a measurement (bearing in mind the initial value you set for closest). calculate distance
  7. Add another Action inside the Item Event, this time Set Value. Set the distance variable to the output of Calculate Distance, via the Action Data. update distance
  8. After Set Value, add an If… Else Action. In the first input, select the distance variable. In the center, select < to check if the current distance is less than the closest so far. In the third input, select the closest variable. distance less
  9. In the nested True Event, add a Set Value Action, setting closest to the value of distance. closest distance
  10. Use the last plus plus button in the window to add an Action after the Iterate Action. Use the closest variable to update your display, for example setting a text view. display closest distance

To achieve an effect similar to the picture at the top of this page, incorporate Add Pin to Map Actions within your array iteration. If you wanted to e.g. only show pins for the closest locations, you could use a second iterate Action after the first one, calculating the distance again each time, and checking for the same distance value in an If… Else to create the pins. Note that depending on your app logic you might prefer to set the initial closest variable value differently, for example using a boolean flag variable to check for the first iteration (if the boolean is false, set closest and update the boolean to true). You can also calculate the travel time between the user’s location and another location in your app.

closest android
If you have an API request in your app that returns an array of locations, you can determine which one is closest to the user’s current location. With the API request returning the location array in a page:

  1. Track the user location.
    • Set a Google Maps API Key in Settings on the left of the editor.
    • In Page Variables on the right, add a new variable, naming it e.g. “user_location” and choosing Location - LatLng type. user latlng
    • Decide if you want continuous location updates or just a single update.
      • For continuous updates, add an Action, for example to the page Resume Event, selecting Start Tracking Location. Select values for the update intervals and accuracy. In the nested Location Updated Event, add a Set Value Action, setting the user_location Page Variable you created to the updated location, via the Event Data. save updated location
      • For a single update, add an Action that will execute before you run your API request, choosing Request Location Update. Select an accuracy level. In the nested Location Updated Event, add a Set Value Action, setting the Page Variable you created to the updated location, via the Event Data. single location updated
  2. Add another two Page Variables, naming them “distance” and “closest”, with Double type. closest double You should now have three new Page Variables.
  3. Add an Action that will execute before your API request runs, choosing Set Value. Set the closest variable to a number that will be higher than the distance between the user and any location, such as 20000 if you plan to use kilometers in your distance calculation. set max distance
  4. Open the request in the API tab on the right of the editor. Open the Events and choose the 200: OK Event (providing it’s associated with the array of locations). Add an Iterate through Array Action. Select the array from the response using the Event Data. closest array
  5. In the nested Item Event, add a Create a LatLng Object Action. Select the latitude and longitude for the current array entry via the Event Data. closest latlng object
  6. Still in the Item Event, add the Calculate Distance Action. Select the user_location variable, the location returned from Create a LatLng Object via the Action Data, and a measurement (bearing in mind the initial value you set for closest). distance user
  7. Add another Action inside the Item Event, this time Set Value. Set the distance variable to the output of Calculate Distance, via the Action Data. distance calculated
  8. After Set Value, add an If… Else Action. In the first input, select the distance variable. In the center, select < to check if the current distance is less than the closest so far. In the third input, select the closest variable. distance less closest
  9. In the nested True Event, add a Set Value Action, setting closest to the value of distance. closest equals distance
  10. Use the last plus plus button in the window to add an Action after the Iterate Action. Use the closest variable to update your display, for example setting a text view. show closest

To achieve an effect similar to the picture at the top of this page, incorporate Create Marker Actions within your array iteration. If you wanted to e.g. only show markers for the closest locations, you could use a second iterate Action after the first one, calculating the distance again each time, and checking for the same distance value in an If… Else to create the markers. Note that depending on your app logic you might prefer to set the initial closest variable value differently, for example using a boolean flag variable to check for the first iteration (if the boolean is false, set closest and update the boolean to true). You can also calculate the travel time between the user’s location and another location in your app.

Was this article helpful to you? Yes No

How can we help?