Best practices for handling thousands of markers with Leaflet

三世轮回 提交于 2019-12-07 04:20:36

问题


I'm doing some tests with an HTML map in conjunction with Leaflet. Server side I have a Ruby Sinatra app serving json markers fetched by a MySQL table. What are the best practices working with 2k-5k and potentially more markers?

  • Load all the markers in the first place and then delegate everything to Leaflet.markercluster.
  • Load the markers every time the map viewport change, sending southWest & northEast points to the server, elaborate the clipping server side and then sync the marker buffer client side with the server-fetched entries (what I'm doing right now).
  • A mix of the two above approaches.

Thanks, Luca


回答1:


Few months has passed since I originally posted the question and I made it through!

As @Brett DeWoody correctly noted the right approach is to be strictly related to the number od DOM elements on the screen (I'm referring mainly to markers). The more the merrier if you device is faster (CPU especially). Since the app I was developing has both desktop and tablet as target devices, CPU was a relevant factor just like the marker-density of different geo-areas.

I decided to separate DBase querying/fetching and map representation/displaying. Basically the user adjusts controls/inputs to filter the whole dataset, afterwards records are fetched and Leaflet.markercluster does the job of representation. When a filter is modified the cycle starts over. User can choose the map zoom level of clusterization depending on their CPU power.

In my particular scenario the above mentioned represented the best approach (verified by console.time). I found that viewport optimisation was good for lower marker-density areas (a pity).

Hope it may be helpful.

Cheers, Luca




回答2:


Try options and optimize when you see issues rather than optimizing early. You can probably get away with just Leaflet.markercluster unless your markers have lots of data attached to them.



来源:https://stackoverflow.com/questions/21795319/best-practices-for-handling-thousands-of-markers-with-leaflet

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!