Select platform: [Android](https://developers.google.com/maps/documentation/mobility/journey-sharing/on-demand/android/customize-polylines.md.txt "View this page for the Android platform docs.") [iOS](https://developers.google.com/maps/documentation/mobility/journey-sharing/on-demand/ios/customize-polylines.md.txt "View this page for the iOS platform docs.") [JavaScript](https://developers.google.com/maps/documentation/mobility/journey-sharing/on-demand/javascript/customize-route-polylines.md.txt "View this page for the JavaScript platform docs.")

<br />

You customize route polylines using the
`ConsumerMapStyle.setPolylineStyleOptions` method. If you set custom polyline
options, they override the default values provided by the Consumer SDK.

**To restore the default values** , call
[`setPolylineStyleOptions`](https://developers.google.com/maps/documentation/mobility/journey-sharing/on-demand/reference/consumer_4/android/reference/com/google/android/libraries/mapsplatform/transportation/consumer/view/ConsumerMapStyle.md.txt#setPolylineStyleOptions(int,%20com.google.android.gms.maps.model.PolylineOptions))
with `null` for the `PolylineOptions` parameter.

**To retrieve the active `PolylineOptions`** , use
[`getPolylineStyleOptions`](https://developers.google.com/maps/documentation/mobility/journey-sharing/on-demand/reference/consumer_4/android/reference/com/google/android/libraries/mapsplatform/transportation/consumer/view/ConsumerMapStyle.md.txt#getPolylineStyleOptions(int)) method.

For more information, see
[`ConsumerMapStyle.setPolylineStyleOptions`](https://developers.google.com/maps/documentation/mobility/journey-sharing/on-demand/reference/consumer_4/android/reference/com/google/android/libraries/mapsplatform/transportation/consumer/view/ConsumerMapStyle.md.txt#setPolylineStyleOptions(int,%20com.google.android.gms.maps.model.PolylineOptions)).

#### Route polyline types

You can customize the following route polyline types:

- `ACTIVE_ROUTE`
- `REMAINING_ROUTE`

`ACTIVE_ROUTE` and `REMAINING_ROUTE` are displayed while following a trip and
represent the [vehicle's route](https://developers.google.com/maps/documentation/mobility/journey-sharing/on-demand/android/customize-polylines.md.txt#active-route).

#### Route polyline properties

Google Maps provides customizable properties available for each polyline in
`PolylineOptions`.

- **To build `PolylineOptions`**, use its constructor.

- **To specify customized properties**, use 'Setter' style methods. Since
  the method provides default values for each property, you only need
  to specify any custom values.

- **To turn off the polyline** , set `visible` to `false`.

For more details, see
[`PolylineOptions`](https://developers.google.com/android/reference/com/google/android/gms/maps/model/PolylineOptions.md.txt) in the Android developer documentation.

#### Example

### Java

```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

```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)
```

### Active and Remaining Route

With journey sharing enabled, your app can customize the
user's experience using polylines to show the active and remaining
route for your vehicle.

- The *active route* is the path the vehicle is now traveling to reach
  the next waypoint in the consumer's active trip.

- The *remaining route* is the path the vehicle still has to travel past
  the active route. When the active route waypoint is the last trip waypoint,
  the remaining route does not exist.

You can customize and control visibility of active and remaining polylines in
your app. By default, the active route is visible and the remaining route
is not visible.

#### Example

### Java

```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

```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)
```

### Traffic-aware polylines

The traffic layer of the polyline is disabled by default. When you enable it,
the renderer draws segments above the route polyline that represent stretches of
non-normal traffic. It includes an offset depending on the traffic condition.
See the Android Developer documentation for [Polyline](https://developers.google.com/android/reference/com/google/android/gms/maps/model/Polyline.md.txt#public-void-setzindex-float-zindex) for more information.

Google maps represent traffic conditions as one of
[four speed types](https://developers.google.com/maps/documentation/mobility/journey-sharing/on-demand/reference/consumer_4/android/reference/com/google/android/libraries/mapsplatform/transportation/consumer/model/TrafficData.SpeedReadingInterval.SpeedType.md.txt).
You can customize the color for each speed type.

**To enable traffic-aware polylines** , construct a `TrafficStyle` object
and then pass it to `ConsumerMapStyle` by calling `setPolylineTrafficStyle()`.

#### Example

### Java

```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

```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)
```