In version 1.0 of Leaflet, when using the FlyTo function as per this JSFiddle, is it possible to force vectors to render/ draw as the animation is happening?

My current issue is when using the marker.cluster function, the animation starts and then none of the points display as you would expect until the animation ends.

I believe the issue is like this OpenLayers question, is there a similar solution for Leaflet?

UPDATE: It appears the issue is related predominately to GeoJSON layers, see this first example that animates well and then this example that uses a GeoJSON layer and the animation doesn't render the vector.

  • The markers in your first example are images, not vectors. If you switch them to CircleMarkers (like this), they behave like the other vectors, pixelating on zoom. Similarly, if you replace the CircleMarkers in your second example with regular markers (like this), they will zoom smoothly. This behavior appears to be browser-dependent. The vectors pixelate during animation in Chrome (version 46.0.2490.80 m) but smoothly scale in Firefox (version 38.0.5). – nathansnider Nov 3 '15 at 15:14
  • I see, perhaps there is a workaround for vectors so that they would reproject on every zoom level? e.g. so that you would still see each expansion of the marker.cluster as the animation happens? – Joshua Dickerson Nov 3 '15 at 16:04

Leaflet author here. The vectors should redraw properly. The quote by @nathansnider is referring to the fact that vectors are not reprojected, but they animate with a CSS transform during animation. If they don't redraw, you should set up a JSFiddle test case and file an issue on GitHub.

update: they currently redraw, but are not reprojected until the animation is over as of beta 2. We want to change it so that vectors are reprojected at least per round zoom, or once per a certain interval of time (e.g. 200ms), which should be a good compromise between performance and visual appearance.

  • Ah! So is the expected behavior that vectors outside the view at the start of the animation will draw as they come into view over the course of the animation? What I am seeing here is that the vectors that are on screen at the start of the animation will move smoothly with the map, but showing only the subset that is clipped to the original view, and then when the animation completes, the vectors will redraw at the new zoom level and location. – nathansnider Nov 3 '15 at 16:11
  • There also does appear to be a genuine bug with flyTo (but different from the original question here): when you click on the map during the animation, the animation will stop, but the vector layers will not redraw. If you pan the map, the vectors will redraw, but offset and scaled as if the map were still at the starting location of the flyTo event. They will remain offset and mis-scaled until you zoom or complete another flyTo. I opened an issue for this on GitHub just now. – nathansnider Nov 3 '15 at 17:30

EDIT: As you can see from @Mourner's answer, I was incorrect, but I am leaving this answer up for the sake of context:

It appears that the decision was made not to redraw vectors during flyTo events. According to the author:

Now the vector layers are a special case in that they need expensive reprojection/clipping/simplification process, which we can't do on each frame because that would be too slow. So we have two options:

  • only reproject on moveend (e.g. after flyTo animation ended)

  • reproject on any move but heavily throttled (e.g. not more often than once per 100ms)

The first option can cause unwanted appearance in some cases, while the second can cause hiccups during a smooth flyTo animation, and are generally less reliable and can cause subtle/hard to track bugs (we've been burned by this in GridLayer refactor).

So the answer to your question of whether it's possible to force vectors to redraw during flyTo would appear to be "no," or at least "not without modifying the core functionality of the animation routines."

  • I noticed this but then further down the page it states that... Got unstuck and made tons of progress here today! Vectors are working with flyTo, all the logic is much cleaner, all events should work as expected. Now we need to fix viewreset and tests, then test it thoroughly on stuff and it'll be a huge relief when this is merged. So i thought the bit that says vectors working with flyTo might be the issue being resolved? – Joshua Dickerson Nov 3 '15 at 9:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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