Display over 200,000 markers in azure maps

Question

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

Answer 1

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.