マーカーをカスタマイズする

プラットフォームを選択: Android iOS JavaScript

ConsumerMapStyle クラスは、マーカーとポリラインの動的なカスタマイズを備えたセッター メソッドとゲッター メソッドを提供します。このクラスを非同期で公開するには、ConsumerController.getConsumerMapStyle() メソッドを使用します。

UI のカスタマイズはデバイスの回転をまたいで保持され、ConsumerController を切断するまで有効です。

マーカーをカスタマイズする

マーカーのタイプとそのプロパティを設定するには、ConsumerMapStyle.setMarkerStyleOptions() メソッドを使用します。カスタム マーカー オプションは、Consumer SDK によって提供されるデフォルト値をオーバーライドします。デフォルト値を復元するには、MarkerOptions パラメータに null を使用して setMarkerStyleOptions() を呼び出します。getMarkerStyleOptions() を使用して、アクティブな MarkerOptions を取得します。

マーカーの種類を選択する

次のマーカー アイコンを使用、カスタマイズできます。

  • TRIP_PICKUP_POINT - ルートの追跡中に表示
  • TRIP_DROPOFF_POINT - ルートの追跡中に表示
  • TRIP_INTERMEDIATE_DESTINATION
  • TRIP_VEHICLE - ルートの追跡中に表示

    Consumer SDK は、ルートを走行する実際の車両の動作を模倣するために、ルート モニタリング中に TRIP_VEHICLE アイコンの回転を更新します。

マーカー オプションを選択する

コンシューマ向けアプリのマーカーをカスタマイズする手順は次のとおりです。

  1. Google マップ MarkerOptions から提供される各マーカーのプロパティを使用します。

  2. コンストラクタを使用して MarkerOptions をビルドします。

  3. 「Setter」スタイルのメソッドを使用してカスタム プロパティを指定します。

  4. 必要に応じて、MarkerOptions コンストラクタで提供されるパターンを模倣して、独自の UI 要素を使用します。

  5. マーカーをオフにするには、visible プロパティを false に設定します。代わりに独自の UI 要素を使用できます。

詳しくは、Google マップの MarkerOptions をご覧ください。

マーカーのカスタマイズの例

Java

// Initializing marker options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setMarkerStyleOptions(
              MarkerType.TRIP_VEHICLE,
              new MarkerOptions()
                  .visible(false));
        });

// Reset marker options to default values.
consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, null);

Kotlin

// Initializing marker options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, MarkerOptions().visible(false))
  })

// Reset marker options to default values.
consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, null)

次のステップ