帶有進度方向的 fitbound 函數

Question

由於我們缺乏英語技能，因此我們使用翻譯進行交流，敬請理解。

我們目前正在使用 React 和 Mapbox 開發地圖。

我們使用下面的編碼是因為我們想在頁面載入時設定地圖的初始位置。

[編碼]

const bounds = new mapboxgl.LngLatBounds();


     cgoData?.forEach((cgoItem: any) => {


       bounds.extend([cgoItem?.prtLogt, cgoItem?.prtLat]);


     });

     mapRef.current?.fitBounds(bounds, {

      duration: 1000,

});

但是，「fitBounds」函數將最近距離的中心點設定為初始位置。

我們想要設定初始位置，包括船舶前進的方向，這並不總是最短距離。

[您現在看到的畫面]

[我們想要的螢幕]

如何設定？

Answer 1

不確定我是否理解了這個問題，但如果我理解了，則有以下幾點：

1. 了解 turf，這是一組對您有幫助的實用程式。例如，它的 bbox 函數 將從陣列或 FeatureCollection 計算邊界框（geojson）。
2. 現在，如果您想保留一些填充，可以在 fitBounds 方法。具體來說，請查看 options.padding