In this article we work with data
Step1. Create 1000 markers
Step 2 or 3. Filter visible markers by viewportWe dont see markers behind map borders. Why not to hide them?
Step 3 or 2. Some markers instersects. Glue themIs one marker hide other marker - why not to hide bottom marker. Sometimes we dont see it.
Sometimes we see it, but we can click it. And sometimes maps become just a bit overloaded
Lets solveSo we sort markers by some field( actuality, qualyty or roughneck )
Next we take one marker, determine area he "own" and moving all markers in this area from map into "stackedChilds" field of first marker.
Next take next, still alive marker, and go on.
To speed up this step lets use "grid" hashtable.
Divide area into WxH rect pieces( one rect must be smaller than marker ).
Precalculate integer indexes of markers position in this grid, and next search you neightboards only in this area
So what step goest first?
Map blocks, Cluster index and render set
As told you - we load markers from server in set of tiles. So then you filter - filter only markers from data tiles you can see now.blocks... tiles... indexes...
Lets repeat this technics one more timeLets divide map to several blocks( and lets name them clusters ), and cluster them as atoms.
cluster step 1: determine visible set
this functions returns set of cluster to update and bounds cluster want to calculate
next insert data into
next ask cluster about visible markers
render set is a VISIBLE markers, and you need to hide all markers not in this set( by yourself )
update set is a set of markers you must show, or update( update also fires then changes internal stack-count of marker)
So hide some markers and show others Note: we collect all hide\show\update in long arrays and execute them in packs. DIP cost and so so :)
To do same just HIDE map, show\hide 10-100 markers and SHOW map.
if you just showing markers - you can create them in other node, detached from document, and then you ready - attach this "group marker" to map node
There is also mistical "DocumentFragments", margical reflow-and-redraw and other dreadfull things, we dont talk about.
End. So what we got1. First ask cluster for bounds it want to calculate
2. Put data only in nodes cluster want to be updated.
3. Clustering is executed only then you have some update or maps moves more than cluster-size pixels
4. Cluster rule you! It produce dirrect comands to show\hide, and you just execute.
5. My english is not so good as this article. Please turn on your own brain-spell-corrector and correct me.
(comrade - to much vodka i drink, and bears cry out on the street and i can sleep ) to find bears on the streets of moskow and see how this clustering works - try GdeEtotDom
Bugs?In this implemetation there is one feature, not the bug.
As we calcucate cluster as atoms - one cluster dont know nothing about markers in next cluster.
So one cluster truly thinks that markers near the edge dont have niegboards( the pass to other cluster )
So you can got something like this.
How to reduce this effect:
variant 1 - make cluster bigger
variant 2 - after clustering tiles we got static set of rendermarkers. Lets try apply one more cluster index on this set, but move cluster start by CLUSTERSIZE/2 px.
As result new clusters will glue wrong markers.
Try it by yourselfFor now you can try this version, but file is not documented and also you can see how it works here
some images used from this article
How to cluster map markers in serven days
– Идиот! – весело сказал Кащей.|
Мышцы радостно запели, настраиваясь на сражение.
– Делать котлеты – это мое призвание!