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

プラットフォームを選択: 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)

次のステップ