Display over 200,000 markers in azure maps

Joshua Burke 1 Reputation point
2021-09-24T15:01:39.147+00:00

What is the best way to enter over 200,000 latitude/longitude onto a azure map? Each marker will link to a photo for a popup for that photo.
Thanks, Josh

Azure Maps
Azure Maps
An Azure service that provides geospatial APIs to add maps, spatial analytics, and mobility solutions to apps.
654 questions
{count} votes

1 answer

Sort by: Most helpful
  1. rbrundritt 16,456 Reputation points Microsoft Employee
    2021-09-27T01:31:18.983+00:00

    Using the traditional HtmlMarker class isn't an option as these create DOM elements which drastically impact performance once you go over 1,000 points. The best way is to use a either a bubble layer or a symbol layer to show the points on a map. These layers can handle hundreds of thousands of points. I would also only have one popup and reuse it (each popup generates DOM elements). Take a look at these resources:

    Bubble layer
    https://learn.microsoft.com/en-us/azure/azure-maps/map-add-bubble-layer
    https://azuremapscodesamples.azurewebsites.net/#Bubble-Layer

    Symbol layer
    https://learn.microsoft.com/en-us/azure/azure-maps/map-add-pin
    https://azuremapscodesamples.azurewebsites.net/#Symbol-Layer

    Popups:
    https://learn.microsoft.com/en-us/azure/azure-maps/map-add-popup#reusing-a-popup-with-multiple-points
    https://azuremapscodesamples.azurewebsites.net/?sample=Reusing%20Popup%20with%20Multiple%20Pins

    You may also want to consider using clustering as you might find the map too crowded to be useful:

    https://learn.microsoft.com/en-us/azure/azure-maps/clustering-point-data-web-sdk
    https://azuremapscodesamples.azurewebsites.net/?sample=Point%20Clusters%20in%20Bubble%20Layer

    One issue you might encounter is the initial download of your data. There are a couple of options if you find that download time is too long.

    The simple option

    Separate the metadata for each point from and only download the coordinates and ID for each location (or any other bare minimum data needed to render the points). Then when a location is clicked to show a popup, use the ID to retrieve the additional metadata from the server on demand. This is a fairly common approach that has worked well for years. It also slows data scrapers down from grabbing all your data.

    The complex option

    Consider creating a vector tiles from your data. This is a decent amount of work, especially if you haven't done this before. But once this has been done, this will likely be the most performant option and is capable of supporting billions of points. Similar to the above, if you have a lot of metadata, or large metadata (e.g. paragraphs descriptions), separating the metadata from the location data and retrieving that separating on demand as needed by the popup would provide the optimal solution.