Hi Everyone

In this vlog we will see how to see multiple points/pushpins on a map in canvas app. As always, this is a no code solution and fairly basic.

I have came across this requirement so many times in Dynamics 365 for e.g. show all customers on a map or contacts on a map or even appointments on a map. Many solutions are available for Dynamics 365 CE including add ons like Maplytics. But for canvas app, following issues persists:

• No map components
• Static bing/google maps can be inserted by inserting an image and then providing URL
• Bing or Google maps API is required
• Hard code latitude and longitude
• If you want to show more than one push pin, you need to hard code all coordinates
• You can’t apply dynamic filters on your maps

To me all of the above are not easy to use solution and that’s why I decided to look for something which all our #nocodemonkeys can use. This can be the fastest way you can plot all your customers on a map within canvas apps.

Prerequisites:

• Access to Power Apps
• Access to Power BI (Desktop and Web)
• Super Basic Knowledge of how to create a chart/report in Power BI
• Basic understanding of Power Apps formulas
• Entity (accounts/contacts/appointments) must have Latitude and Longitude filled (otherwise it won’t be shown on maps

Note: You can get latitude and longitude by create a flow in Power Automate

Step 1-7 for Power BI and Step 8-12 Power Apps

Step 1: Go to your Power BI Desktop>>Create a connection>>Get data (e.g. Accounts)

Step 2: Once your data is loaded>>click on report icon and then add the visualisation type as shown below:

Step 3: Add data fields

Step 4: Save your Power BI report by clicking on the disk button on top left

Step 5: Login to Power BI web https://app.powerbi.com/

Step 6: Click on ‘Workspace’ in the left navigation and then click reports (this is where you can find the report you created in above steps)

Step 7: Click on the report to open and then click pin visual

Step 8: Login to Power Apps https://make.powerapps.com/ and pick your existing app or create a new canvas app

Step 9: Click Insert then ‘Power BI tile’

Step 10: Select Workspace, Dashboard and Tile

Dynamic Filtering- Step 11 & 12

Step 11: Apply dynamic filtering by adding new components like Text Input or Drop Downs. In my case, I have two drop downs and one text input; names below:

StateDropDown- With 5 values (you can have any values here)

CityDropDown-With 5 values (you can have any values here)

txtPostCode- Text input for ZIP/Postal Code

Step 12: Update the ‘TileURL’ of Power BI tile. Use the following sub-steps based on how many filters you need as it can go to Nth level (I am only showing three)

12a. One field filter

“Power BI TileURL” & If(!IsBlank(txtPostCode.Text),
“&$filter=accounts/address1_postalcode eq ‘” & txtPostCode.Text & “‘”)

12b. Two fields filter

“Power BI TileURL” & If(!IsBlank(txtPostCode.Text),
“&$filter=accounts/address1_postalcode eq ‘” & txtPostCode.Text & “‘”,
!IsBlank(CityDropdown.SelectedText.Value),
“&$filter=accounts/address1_city eq ‘” & CityDropdown.SelectedText.Value & “‘”)

12c. Three fields filter

“https://app.powerbi.com/embed?dashboardId=ed06a838-8b0f-4445-a582-1890699df2d3&tileId=401efbc1-2194-4807-a07e-7e89567e49ce&config=eyJjbHVzdGVyVXJsIjoiaHR0cHM6Ly9XQUJJLUFVU1RSQUxJQS1FQVNULUEtUFJJTUFSWS1yZWRpcmVjdC5hbmFseXNpcy53aW5kb3dzLm5ldCJ9” & If(
!IsBlank(txtPostCode.Text),
“&$filter=accounts/address1_postalcode eq ‘” & txtPostCode.Text & “‘”,
!IsBlank(CityDropdown.SelectedText.Value),
“&$filter=accounts/address1_city eq ‘” & CityDropdown.SelectedText.Value & “‘”,
!IsBlank(StateDropdown.SelectedText.Value),
“&$filter=accounts/address1_stateorprovince eq ‘” & StateDropdown.SelectedText.Value & “‘”
)

Note: Screenshot below for better understanding

Result after dynamic filters

Video here:

Hope it helps!

Subscribe to my channel and follow my blog.

Thanks!

Let’s keep sharing!