自訂路線折線

選取平台： Android iOS JavaScript

您可以使用 ConsumerMapStyle.setPolylineStyleOptions 方法自訂路線折線。如果您設定自訂折線選項，系統會覆寫 Consumer SDK 提供的預設值。

如要還原預設值，請使用 PolylineOptions 參數的 null 呼叫 setPolylineStyleOptions。

如要擷取有效的 PolylineOptions，請使用 getPolylineStyleOptions 方法。

詳情請參閱 ConsumerMapStyle.setPolylineStyleOptions。

路線折線類型

您可以自訂下列路線折線類型：

  • ACTIVE_ROUTE
  • REMAINING_ROUTE

在追蹤行程時，系統會顯示 ACTIVE_ROUTE 和 REMAINING_ROUTE，代表車輛路線。

路線折線屬性

Google 地圖提供可自訂的屬性，適用於 PolylineOptions 中的每條折線。

  • 如要建構 PolylineOptions，請使用其建構函式。

  • 如要指定自訂屬性，請使用「Setter」樣式方法。由於這個方法會為每個屬性提供預設值，因此你只需要指定任何自訂值。

  • 如要關閉折線，請將 visible 設為 false。

詳情請參閱 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 地圖會以四種速度類型之一表示路況。你可以為每種速度類型自訂顏色。

如要啟用可顯示流量的折線，請建構 TrafficStyle 物件，然後呼叫 setPolylineTrafficStyle()，將該物件傳遞至 ConsumerMapStyle。

範例

Java

// TrafficStyle is part of the Consumer SDK.
int orange = Color.rgb(255, 165, 0);
TrafficStyle trafficStyle = TrafficStyle.builder()
  .setTrafficVisibility(true)
  .setTrafficColor(SpeedType.NO_DATA, Color.GREY)
  .setTrafficColor(SpeedType.NORMAL, Color.BLUE)
  .setTrafficColor(SpeedType.SLOW, orange)
  .setTrafficColor(SpeedType.TRAFFIC_JAM, Color.RED)
  .build();

consumerMapStyle.setPolylineTrafficStyle(PolylineType.ACTIVE_ROUTE, trafficStyle);

Kotlin

// TrafficStyle is part of the Consumer SDK.
val orange = Color.rgb(255, 165, 0)
val trafficStyle =
  TrafficStyle.builder()
    .setTrafficVisibility(true)
    .setTrafficColor(SpeedType.NO_DATA, Color.GRAY)
    .setTrafficColor(SpeedType.NORMAL, Color.BLUE)
    .setTrafficColor(SpeedType.SLOW, orange)
    .setTrafficColor(SpeedType.TRAFFIC_JAM, Color.RED)
    .build()

consumerMapStyle.setPolylineTrafficStyle(PolylineType.ACTIVE_ROUTE, trafficStyle)