Mapbox-gl-js: A way to limit animation duration on flyTo or fitBounds

Created on 8 Jan 2017  路  7Comments  路  Source: mapbox/mapbox-gl-js

Hi there. Is there any way to retrieve a transition duration before or after it begins? I'd like to avoid too long transitions on camera actions (flyTo, fitBounds, etc.) when the target point is too far away, like Google Maps does. I'd rather avoid to redo the entire calculations done internally... For example:

  1. Map is centered on point A
  2. Programmatically make it centers on point B
  3. Transition begins
  4. Check transition duration (looks like it's set here)
  5. If duration > 3s, trigger 2. again with {animate: false}

Can't find any proper or hacky way to do it :) For sure the best scenario would be an option like maxDurationForAnimation!

Thanks.

feature good first issue

Most helpful comment

I like the maxDuration option suggestion. We would then either set the duration to 0 if calculated flyTo duration exceeds maxDuration, or we could do duration = Math.min(duration, maxDuration) to limit the duration but still animate every time.

All 7 comments

Maybe just an option, "maxTime" to those functions, since that's your actual goal? What do you want to happen if the transition would take longer than that, though? Jump to?

Yes that would be perfect!

I like the maxDuration option suggestion. We would then either set the duration to 0 if calculated flyTo duration exceeds maxDuration, or we could do duration = Math.min(duration, maxDuration) to limit the duration but still animate every time.

Yes but the 2nd option could mean super fast transition from Pekin to New York at zoom 15 for example, doesn't it? (Should I edit the title ?)

@nicooprat yeah, it looks like the first option would be more practical, and in line with what some other mapping APIs do.

I've created PR for this issue https://github.com/mapbox/mapbox-gl-js/pull/5349

Thanks guys :)

Was this page helpful?
0 / 5 - 0 ratings