Personalizar polilinhas do trajeto

Selecione a plataforma: Android iOS JavaScript

Personalize as polilinhas de rota usando o método ConsumerMapStyle.setPolylineStyleOptions. Se você definir opções de linha poligonal personalizadas, elas vão substituir os valores padrão fornecidos pelo SDK do consumidor.

Para restaurar os valores padrão, chame setPolylineStyleOptions com null para o parâmetro PolylineOptions.

Para recuperar o PolylineOptions ativo, use o método getPolylineStyleOptions.

Para saber mais, consulte ConsumerMapStyle.setPolylineStyleOptions.

Tipos de polilinha de trajeto

Você pode personalizar os seguintes tipos de polilinha de trajeto:

  • ACTIVE_ROUTE
  • REMAINING_ROUTE

ACTIVE_ROUTE e REMAINING_ROUTE são exibidos ao seguir uma viagem e representam a rota do veículo.

Propriedades da polilinha da rota

O Google Maps oferece propriedades personalizáveis disponíveis para cada poligonal em PolylineOptions.

  • Para criar PolylineOptions, use o construtor.

  • Para especificar propriedades personalizadas, use métodos de estilo "Setter". Como o método fornece valores padrão para cada propriedade, você só precisa especificar os valores personalizados.

  • Para desativar a polilinha, defina visible como false.

Para ver mais detalhes, consulte PolylineOptions na documentação do desenvolvedor Android.

Exemplo

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)

Rota ativa e restante

Com o compartilhamento de viagens ativado, seu app pode personalizar a experiência do usuário usando polilinhas para mostrar os trajetos ativos e restantes do veículo.

  • O trajeto ativo é o caminho que o veículo está percorrendo para chegar ao próximo waypoint na viagem ativa do consumidor.

  • A rota restante é o caminho que o veículo ainda precisa percorrer após a rota ativa. Quando o waypoint da rota ativa é o último waypoint da viagem, o trajeto restante não existe.

Você pode personalizar e controlar a visibilidade das polilinhas ativas e restantes no seu app. Por padrão, o trajeto ativo fica visível, e o restante não fica.

Exemplo

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)

Polilinhas com informações de trânsito

A camada de tráfego da poligonal fica desativada por padrão. Quando ativado, o renderizador desenha segmentos acima da polilinha do trajeto que representam trechos de trânsito fora do normal. Ele inclui um deslocamento dependendo da condição do tráfego. Consulte a documentação para desenvolvedores do Android sobre Polyline para mais informações.

O Google Maps representa as condições de trânsito como um dos quatro tipos de velocidade. Você pode personalizar a cor de cada tipo de velocidade.

Para ativar polilinhas com informações de tráfego, crie um objeto TrafficStyle e transmita-o para ConsumerMapStyle chamando setPolylineTrafficStyle().

Exemplo

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)