Mapbox GL JS:ルートに沿ったバナー命令の更新(次の操縦ポイントの検索)

Aug 25 2020

Mapbox AndroidSDKおよびiOSSDKにはナビゲーション機能がありますが、Mapbox GLJSにはありません。利用可能な機能を使用して、Mapbox GLJSでナビゲーションエクスペリエンスを作成しようとしています。しかし、バナーの説明に問題があります。ルートに沿って、次の操作と表示するバナー命令を知る方法。

stackoverflowとgoogleの回答のほとんどは、最も近い操縦ポイントを見つけることを示していますが、現在の位置の前と後ろの2つの操縦ポイントを与えることができます。ポイントが現在の場所に最も近い場合でも、操縦ポイントがすでに通過したかどうかを知る方法はありますか?

私が欲しいのは、Mapbox Android SDKのBannerInstructionObserverのようなもので、バナーや操作をいつ更新するかを知ることができます。Mapbox GL JSを使用して実装できる、この背後にあるロジックは何ですか?

回答

1 spockshr Aug 28 2020 at 22:35

出発地と目的地が与えられたとすると、次の図に示すようなルートが得られたとしましょう。

json応答では、ルートの(緯度、経度)も指定されます。ルートの(lat、lon)は、操作によって分離されたステップとして指定されます(各ステップの開始は操作です)。これを下の図に示します:(円はルートに沿った(lat、lon)値です)

ここで、上の図に示すように、ルートに沿ったある時点にいるとしましょう。

そう、

  1. 最も近い操縦ポイントを見つけます。この場合、maneuver_1です。ただし、maneuver_1は表示しません。最も近いマニューバではなく、ルート内の次のマニューバを表示したいと思います。currentStep =(最も近い操縦ポイントインデックス)

  2. currentStepステップで、現在の場所に最も近い(lat、lon)ポイントと、そのポイントまでの距離を見つけます。distanceToNearestPoint_One

  3. (currentStep-1)ステップで、現在の場所に最も近い(lat、lon)ポイントとそのポイントまでの距離を見つけます。distanceToNearestPoint_Two

  4. distanceToNearestPoint_One> distanceToNearestPoint_Twoの場合、currentStep = currentStep-1

ここまでステップを見つけましたが、現在の場所はにあります。

  1. ライダーに表示されるマニューバ、nextManeuver = Maneuver [currentStep + 1]

以下のシナリオについて、上記の方法に従います。

以下に示す、わずかに異なるシナリオでの方法に従います。

Moritz Aug 25 2020 at 15:02

Mapbox GLGSにはそのような機能がないのは正しいです。

私は過去に、ウェイポイントとそれぞれの操縦指示のリストを保持し、リストから訪問したものを削除することによってこれを回避しました。現在のウェイポイント/マニューバはリストの次のものです。現在の位置の範囲に入ると表示します。

Mapbox Directions APIからルートをリクエストすることで、取得したdirectionsRouteオブジェクトからこれらのリストを生成できます。