Personalizar polilinhas do trajeto

Selecione a plataforma: Android iOS JavaScript

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

Para restaurar os valores padrão, chamarsetPolylineStyleOptions comnull para oPolylineOptions parâmetro.

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

Para saber mais, consulte ConsumerMapStyle.setPolylineStyleOptions.

Tipos de polilinha de rota

Você pode personalizar os seguintes tipos de polilinhas de rota:

• ACTIVE_ROUTE
• REMAINING_ROUTE

ACTIVE_ROUTE e REMAINING_ROUTE são mostrados durante uma viagem e representam o trajeto do veículo.

Propriedades da polilinha de rota

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

• Para criar PolylineOptions, use o construtor dele.

• 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 valores personalizados.

• Para desativar a polilinha, defina visible como false.

Para mais detalhes, consulte PolylineOptions na documentação para desenvolvedores 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 aplicativo pode personalizar a experiência do usuário usando polilinhas para mostrar a rota ativa e a rota restante do seu veículo.

• A rota ativa é o caminho que o veículo está percorrendo para chegar ao próximo ponto de referência na viagem ativa do consumidor.

• A rota restante é o caminho que o veículo ainda precisa percorrer além da rota ativa. Quando o ponto de parada da rota ativa é o último da viagem, a rota restante não existe.

É possível personalizar e controlar a visibilidade de polilinhas ativas e restantes no seu app. Por padrão, a rota ativa fica visível, e a restante não.

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 polilinha fica desativada por padrão. Quando você ativa essa opção, o renderizador desenha segmentos acima da polilinha da rota que representam trechos de tráfego não normal. Ele inclui um ajuste dependendo da condição do trânsito. Consulte a documentação para desenvolvedores Android sobre Polylines 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 as polilinhas com reconhecimento de tráfego, crie um objeto TrafficStyle e transmita-o para ConsumerMapStyle chamando setPolylineTrafficStyle().

Exemplo

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)