Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I want to use Leaflet due to the smooth transitions which Openlayers seems like they can't match. I specifically require the ability to cluster markers with custom styled marker groups.

The best example which demonstrates what I am trying to achieve can be found at Redfin.

Please notice hovering over a cluster provides for a slick animation and by clicking on a marker the clusters split apart with an animated effect. When reaching a zoom level where individual points don't overlap with a given tolerance the actual markers split out to their locations in an animated fashion.

I really would love to integrate similar effects to these and would appreciate some guidance on the best approach or other examples you might be aware of.

Note: Redfin seems to be using Flash which I want to stay away from. In an ideal situation I would like to achieve this through Javascript if possible but think it probably needs to be done through HTML5/canvas.

Maybe the use of p. - Raphael.js or d3.js

Any ideas?

BTW - found this example but it seems to specifically apply to Google Maps.

share|improve this question
I don't think Redfin are using flash. It looks like it is all javascript using the dojo toolkit ( ). I didn't spot any other mapping libraries though - they could be using them also. – djq Nov 26 '11 at 22:49
I'm currently developing a Leaflet clustering layer - It doesn't do anything really fancy yet, but I am planning on adding things like customizable marker images and zoom-transition strategies. Feel free to add enhancement requests to the issue tracker. – cavis Jul 15 '12 at 17:02
up vote 21 down vote accepted

If you want a clusterer like redfin then check out my Leaflet.markercluster:

It is fully animated etc etc :)

share|improve this answer
Yup - the best and let me be the first to welcome you Dave and let me boost up your points for your help. – Jul 27 '12 at 13:29
Pretty awesome! +1 – unicoletti Jul 27 '12 at 14:02

OpenLayers has also a cluster strategy. All you need to do is to specify as strategy in the vector layer.

The solution is very "simple" for the moment, simply reduces the number of points depending on the zoom level. If you need something more awesome you will need to program it by yourself and your needs. Take a look also to SelectFeature control which can serve you to control when you put the mouse over a feature.

The redfin is really fashion sample. Hope I have some time to make some test with OL :)

share|improve this answer
I would like to use OpenLayers but I need the smooth transitions like those found in leaflet. Are you aware of any openlayers hack which replicates these slick zoom animations? – Jan 9 '12 at 3:25
Sorry but no. Right now I'm doing some testing styling a bit the "dots" adding some color and count number in the circle. But adding animation is far away for the moment. – EricSonaron Jan 9 '12 at 18:06
Did you ever find a solution to this with the new ol3 capabilities? – Jul 1 '12 at 1:01

I haven't had much time to look into it, but CloudMade (makers of Leaflet) has some Marker Clustering capabilities. How to make them animated and sleek, not sure about that, but it's a start.

share|improve this answer

For Leaflet Users.

Here's a port of the Google Maps MarkerClusterer for Leaflet

share|improve this answer
Yeah, i have that bookmarked but I still require the animation part – Apr 9 '12 at 2:30

I have just implemented a so called AnimatedCluster strategy for OpenLayers. You can see a bit more about it at:

It is only a firts version but adds a nice animation to the clusters. There are many things to improve but it is a starting point.

share|improve this answer
great job with this! – Aug 23 '12 at 13:42

Have you looked at the polymaps example which clusters points?

The circles here are vectors which can be modified using css.

share|improve this answer
thanks but I specifically have been looking for any type of solutions (preferably cross-browser supported) which would allow for the animation of markers. I am not sure if you had the opportunity to check out the link example (…) from Redfin. That link represents what I am looking to achieve - slick marker animation representations the deeper you click on/into/zoom into the clustered markers/areas. – Apr 10 '12 at 5:55

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.