Você está vendo a versão antiga da página. Ver a versão atual.

Comparar com o atual Ver Histórico da Página

Versão 1 Próxima »

Desenha rota

Recebe o ponto de saída e destino e desenha uma rota no mapa.

Parâmetros

NomeTipoDoc
Parâmetro 1objetoInserimos o Id do componente Google Maps.
Parâmetro 2objetoRecebe um objeto com as informações para traçar a rota.
Parâmetro 3objetoConfigurações avançadas para edições na rota, definindo opções de rota de acordo com sua preferência. Clique aqui para mais opções de configuração diferentes do exemplo.
Parâmetro 4objetoReceberá outras funções para incluir no desenha rota. 

Compatibilidade

 Cliente

Exemplo

Nesse exemplo, após criar o bloco com a função "GeraRota", criaremos duas variáveis, uma com o nome "saida" e outra com o nome "destino" com o bloco atribuir variável, as variáveis irão receber o bloco obtém variável de escopo com o nome "saida" e "destino" em seu parâmetro como na Figura 1.

Arrastaremos o bloco direção da rota, que será responsável por receber o ponto de saída e de destino e definir a direção da rota, em seguida, no parâmetro requisição da rota, arrastaremos o bloco criar rota, em ponto de origem, arrastaremos o bloco criar coordenada, em latitude e longitude. Em latitude arrastaremos o bloco obter propriedade do autocompletar, no parâmetro autocompletar atribuiremos a variável saída e no tipo do endereço, a latitude. Repetiremos em longitude o que acabamos de fazer em latitude, definindo o tipo do endereço para longitude. Agora faremos o mesmo feito em Ponto de origem com o parâmetro ponto de destino do bloco criar rota, mas atribuiremos ao parâmetro autocompletar a variável destino e definiremos no parâmetro modo da viagem como carro (deixaremos opções avançadas vazio).

Por fim, no parâmetro Comandos do bloco Direção da rota, arrastaremos o bloco desenha rota, onde no parâmetro id do mapa definiremos o id do componente Google Maps, no parâmetro item direção da rota arrastaremos a variável item, e por último, nas opções avançadas, colocaremos o objeto abaixo para instruir o serviço a evitar rodovias sempre que possível.

Opções avançadas
{"avoidHighways": true}


Figura 1 - Bloco Desenha rota


Figura 2 - Rota desenhada após a execução da função referente à figura 1.

Mais sobre o bloco

Para entender melhor o funcionamento desse bloco, recomendamos acessar a documentação Usando a API do Google Maps em seu projeto na Figura 5.7.

  • Sem rótulos