In MapboxGL JS, is it possible to watch a "flyTo" event triggered by the geolocate API, and not the user moving around the screen manually by dragging the map?
I'm trying to trigger an action in my application only when the user successfully enters a search into the Geolocation controller. The map has a movestart event that works for this, but it also captures the user's movement of the screen via the cursor or their finger.
import Geocoder from "@mapbox/mapbox-gl-geocoder";
const geocoder = new Geocoder({
countries: "us",
accessToken: mapboxGl.accessToken,
mapboxgl: mapboxGl,
marker: false,
render: function (item) {
return `<span class='geocoder-dropdown-text'>${item.text}</span>`;
},
});
map.on("movestart", (e) => {
// The problem is this event is too broad...
});
Is it possible to only listen for the "flying" event when the Geolocation API fires, or specifically provide a callback to the Geocoder that will fire when the animation begins?
You can create a variable flying and set it to true when the fly starts. Then you can listen for events movestart or moveenv and check if it is dragged by a user or triggered fly event.
let flying = false;
map.on("flystart", function ()
flying = true;
});
map.on("flyend", function () {
flying = false;
});
map.on("moveend", function () {
if (flying) {
map.fire("flyend");
}
});
function fly() {
map.flyTo({
center: [....],
});
map.fire("flystart");
}
Fiddle: https://jsfiddle.net/wdtc91qo/