MapboxGl 区分"Move"和"Fly"事件

Question

在MapboxGL JS中，是否可以观看"flyTo"事件由地理定位API触发，而不是用户通过拖动地图在屏幕上手动移动?

我试图在我的应用程序中触发一个操作，只有当用户成功地在Geolocation控制器中输入搜索。地图有一个movestart事件，但它也通过光标或手指捕捉用户在屏幕上的移动。

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...
});

能不能只听"飞行"?事件，还是专门为Geocoder提供一个回调，在动画开始时触发?

Answer 1

您可以创建一个变量flying，并在飞行开始时将其设置为true。然后，您可以监听事件movestart或moveenv，并检查它是否被用户拖动或触发飞行事件。

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");
}

小提琴:https://jsfiddle.net/wdtc91qo/

Answer 2

查看发出的事件，有一个originalEvent属性，仅在事件源为本机时设置，即TouchStart,MouseWheel等。

这样就可以区分用户移动和程序移动，如下所示:

map.on('movestart', (e) => {
const isUserMovement = 'originalEvent' in e;
})