ルートのポリラインをカスタマイズする

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

ルートのポリラインをカスタマイズするには、 ConsumerMapStyle.setPolylineStyleOptions メソッドを使用します。カスタム ポリラインを設定した場合 Consumer SDK から提供されるデフォルト値をオーバーライドします。

デフォルト値に戻すには、次のメソッドを呼び出します。 setPolylineStyleOptions PolylineOptions パラメータに null に置き換えます。

アクティブな PolylineOptions を取得するには、次のコマンドを使用します。 getPolylineStyleOptions メソッドを使用します。

詳細については、ConsumerMapStyle.setPolylineStyleOptions をご覧ください。

ルート ポリラインのタイプ

以下の経路のポリライン タイプをカスタマイズできます。

  • ACTIVE_ROUTE
  • REMAINING_ROUTE

経路の共有中に ACTIVE_ROUTEREMAINING_ROUTE が表示されます。 車両のルートを表す

ルート ポリラインのプロパティ

Google マップでは、各ポリラインで使用できるカスタマイズ可能なプロパティが提供されています。 PolylineOptions

  • PolylineOptions をビルドするには、そのコンストラクタを使用します。

  • カスタマイズしたプロパティを指定するには、「Setter」を使用します。スタイル メソッド。以降 メソッドは各プロパティのデフォルト値を指定します。 カスタム値を指定できます

  • ポリラインをオフにするにはvisiblefalse に設定します。

詳しくは、 Android デベロッパー向けドキュメントの PolylineOptions

Java

// Initializing polyline style options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.ACTIVE_ROUTE,
              new PolylineOptions()
                  .visible(false));
        });

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null);

Kotlin

// Initializing polyline options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    consumerMapStyle.setPolylineStyleOptions(
      PolylineType.ACTIVE_ROUTE,
      PolylineOptions().visible(false)
    )
  })

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null)

アクティブなルートと残りのルート

ルート共有を有効にすると、アプリはポリラインを使用してユーザー エクスペリエンスをカスタマイズし、車両のアクティブなルートや残りのルートを表示できます。

  • アクティブなルートは、お客様のアクティブなルートの次のウェイポイントに到達するために車両が現在走行している経路です。

  • 残りのルートは、車両が通過する予定の経路です。 ルートを使用します。アクティブなルートのウェイポイントが最後のルートのウェイポイントである場合、 残りのルートは存在しません。

以下では、アクティブなポリラインと残りのポリラインの表示設定をカスタマイズし、制御できます。 説明します。デフォルトでは、アクティブなルートが表示され、残りのルートは は表示されません。

Java

// Initializing polyline options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.ACTIVE_ROUTE,
              new PolylineOptions()
                  .color(Color.BLUE));
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.REMAINING_ROUTE,
              new PolylineOptions()
                  .color(Color.BLACK)
                  .width(5)
                  .visible(true));
        });

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null);
consumerMapStyle.setPolylineStyleOptions(PolylineType.REMAINING_ROUTE, null);

Kotlin

// Initializing polyline options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    {
      consumerMapStyle.setPolylineStyleOptions(
        PolylineType.ACTIVE_ROUTE,
        PolylineOptions().color(Color.BLUE)
      )

      consumerMapStyle.setPolylineStyleOptions(
        PolylineType.REMAINING_ROUTE,
        PolylineOptions().color(Color.BLACK).width(5).visible(true)
      )
    }
  })

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null)

consumerMapStyle.setPolylineStyleOptions(PolylineType.REMAINING_ROUTE, null)

交通量に応じたポリライン

ポリラインの交通状況レイヤは、デフォルトでは無効になっています。有効にすると レンダラは、ルート ポリラインの上に線分を描画します。 異常トラフィックを検出できます交通状況に応じたオフセットが含まれます。 詳しくは、Android デベロッパー向けドキュメントの Polyline をご覧ください。

Google マップでは、交通状況を 4 種類の速度。 速度のタイプごとに色をカスタマイズできます。

交通認識ポリラインを有効にするにはTrafficStyle オブジェクトを作成します。 次に、setPolylineTrafficStyle() を呼び出して ConsumerMapStyle に渡します。

Java

// TrafficStyle is part of the Consumer SDK.
TrafficStyle trafficStyle = TrafficStyle.builder()
  .setTrafficVisibility(true)
  .setTrafficColor(SpeedType.NO_DATA, Color.GREY)
  .setTrafficColor(SpeedType.NORMAL_VALUE, Color.BLUE)
  .setTrafficColor(SpeedType.SLOW_VALUE, Color.ORANGE)
  .setTrafficColor(SpeedType.TRAFFIC_JAM, Color.RED)
  .build();

consumerMapStyle.setPolylineTrafficStyle(PolylineType.ACTIVE_ROUTE, trafficStyle);

Kotlin

// TrafficStyle is part of the Consumer SDK.
val trafficStyle =
  TrafficStyle.builder()
    .setTrafficVisibility(true)
    .setTrafficColor(SpeedType.NO_DATA, Color.GREY)
    .setTrafficColor(SpeedType.NORMAL_VALUE, Color.BLUE)
    .setTrafficColor(SpeedType.SLOW_VALUE, Color.ORANGE)
    .setTrafficColor(SpeedType.TRAFFIC_JAM, Color.RED)
    .build()

consumerMapStyle.setPolylineTrafficStyle(PolylineType.ACTIVE_ROUTE, trafficStyle)