web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Apps / Add Label to Gallery t...
Power Apps
Unanswered

Add Label to Gallery to display distance between two locations

(0) ShareShare
ReportReport
Posted on by Microsoft Employee

I have a sharepoint list that contains a column for name, hometown/state and high school.

 

In PowerApps, I have text input field where users can enter a city and state.

 

I used the columns to create the gallery in the screenshot and I want to add a label into the gallery that would be able to calculate the distance between the text input fieldc city and state and the hometown and state field from SharePoint. 

 

I am currently using the Bing Maps API. Any ideas?
Distance.jpg

Categories:
I have the same question (0)
  • v-xida-msft Profile Picture
    Microsoft Employee on at

    Hi @Anonymous ,

    Could you please share a bit more about your scenario?

    Do you want to calculate the distance between two different address (city, state)?

    The user @NickK has faced similar issue with you, please check the response within the following thread:

    https://powerusers.microsoft.com/t5/General-Discussion/Sort-gallery-by-closest-location-after-search-is-it-possible/m-p/183247

     

    On your side, you should convert the corresponding address into proper location value (Latitude and Longitude) using the BingMaps.GetLocationByAddress() function (Bing Maps connector supports). Then you could calculate the distance between two difference location values using solution mentioned in above thread I provided.

     

    I have made a test on my side, please take a try with the following workaround:

    Firstlt, you need to add a Bing Maps connector within your app.

    4.JPG

     

    5.JPG

    Within the Gallery, add a Text Input control, set the Default property to following:

     

    Acos(
     Cos(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInput6.Text, ", ")).Result, locality:First(Split(TextInput6.Text, ", ")).Result}).point.coordinates.latitude))*Cos(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))+Sin(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInput6.Text, ", ")).Result, locality:First(Split(TextInput6.Text, ", ")).Result}).point.coordinates.latitude))*Sin(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))*Cos(Radians(BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInput6.Text, ", ")).Result, locality:First(Split(TextInput6.Text, ", ")).Result}).point.coordinates.longitude-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))
    )*6371

    On your side, you should set the Text property of the Label control to following:

     

     

    Acos(
     Cos(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInputBox.Text, ", ")).Result, locality:First(Split(TextInputBox.Text, ", ")).Result}).point.coordinates.latitude))*Cos(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))+Sin(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInputBox.Text, ", ")).Result, locality:First(Split(TextInputBox.Text, ", ")).Result}).point.coordinates.latitude))*Sin(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))*Cos(Radians(BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInputBox.Text, ", ")).Result, locality:First(Split(TextInputBox.Text, ", ")).Result}).point.coordinates.longitude-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))
    )*6371

    Note: The TextInputBox represents the Text Input control within your app, where the user could enter a city and state. The 'Hometown/State' represents the 'Hometown/State' column in your SP list.

     

    You could consider take a try to round above distance result to the 2 number of decimal places, please take a try with the following workaround:

    Round(Acos(
     Cos(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInputBox.Text, ", ")).Result, locality:First(Split(TextInputBox.Text, ", ")).Result}).point.coordinates.latitude))*Cos(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))+Sin(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInputBox.Text, ", ")).Result, locality:First(Split(TextInputBox.Text, ", ")).Result}).point.coordinates.latitude))*Sin(Radians(90-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))*Cos(Radians(BingMaps.GetLocationByAddress({adminDistrict:Last(Split(TextInputBox.Text, ", ")).Result, locality:First(Split(TextInputBox.Text, ", ")).Result}).point.coordinates.longitude-BingMaps.GetLocationByAddress({adminDistrict:Last(Split(ThisItem.'Hometown/State', ", ")).Result, locality:First(Split(ThisItem.'Hometown/State', ", ")).Result}).point.coordinates.latitude))
    )*6371,
    2)

     

    Best regards,

  • Community Power Platform Member Profile Picture
    Microsoft Employee on at

    @v-xida-msft So far go good! How to do convert the KM to miles?

  • Community Power Platform Member Profile Picture
    Microsoft Employee on at

    @v-xida-msft I may have spoken too soon. The results of the calculation seem to be off, in your example and mine. The results are all too close from each other..especially since Jacksonville is many states away from those cities.

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Season of Sharing Community Challenge Winners!

Congratulations to our community stars!

Kudos to our 2025 Community Spotlight Honorees

Expanding mentorship, skilling, and AI innovation

Congratulations to the July Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Power Apps

#1
WarrenBelz Profile Picture

WarrenBelz 392 Most Valuable Professional

#2
11manish Profile Picture

11manish 181 Super User 2026 Season 2

#3
MS.Ragavendar Profile Picture

MS.Ragavendar 112 Super User 2026 Season 2

Last 30 days Overall leaderboard