10

I'd like to show an overlay when the Mapbox flyto camera movement has completed its action, and is in place at the correct position and zoom level. Is there a way to know when that action is complete?

So, fly to a position and then show the overlay, basically.

14

You can achieve this by combining a few map event listeners and a variable as follows.

To prevent a tooltip when the user has moved or zoomed the map by mouse or keyboard you will need a variable that determines wheter your user clicked the "fly" button or not:

map.on('flystart', function(){
    flying = true;
});
map.on('flyend', function(){
    flying = false;
});

Then this code will execute once your map has stopped moving and zooming:

map.on('moveend', function(e){
   if(flying){
      // tooltip or overlay here
      map.fire(flyend); 
   }
});

See demo: http://jsfiddle.net/ft7s8son/

  • Doh. I looked at that list of events and never saw moveend. Thank you! – Bill Thornton Dec 15 '15 at 13:22
  • Dude, I really appreciate it! This works great! – willbeeler Aug 24 '17 at 17:43

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.