javascript - Mapbox.GL : scroll zoom in and out to specific coordinates on custom mapbox map

Question

我已将自定义 Mapbox Studio map 嵌入到我的网站上，并设置了 minZoom 和 maxZoom 坐标，因此它仅缩小到某个缩放级别并放大到某个缩放级别。但是当用户放大时， map 会转到用户放置鼠标指针的位置，这是正确的，但我希望它放大回其起点，而不是用户放置鼠标指针的位置。
这是我找到的最接近的示例，但我不需要叙述，我希望用户只需在 map 上滚动:https://www.mapbox.com/mapbox-gl-js/example/scroll-fly-to/

如何做到当用户向下滚动时嵌入 map 会缩小到一组特定的坐标，而当用户向上滚动时，嵌入的 map 会放大到一组特定的坐标？

var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v8',
center: [-118.451784, 34.035947], // starting position
zoom: 11.66,
maxZoom: 11.66, // starting zoom
minZoom: 1.4, // ending zoom
doubleClickZoom: false,
dragRotate: false,
dragPan: false

});

Answer 1

不幸的是，这对于现有的 mapbox-gl-js API 来说并不容易。我推荐disabling all the built-in interaction handlers并为 wheel event 编写您自己的事件处理程序调用 Map#setZoom