Recentemente estava à procura de um exemplo que me permitisse traçar uma rota no Google Maps e pegar a distância total através do Delphi. Encontrei vários artigos, mas estava difícil encontrar um que me atendesse. Os exemplos geralmente mostravam apenas como localizar um endereço no mapa do Google. O Google disponibiliza valiosas informações de como implantar a API (http://code.google.com/intl/pt-BR/apis/maps/index.html), mas o fator tempo e não querer reinventar a roda, me fizeram continuar a procura. Depois de vários artigos, encontrei um ótimo exemplo no site http://www.jasontpenny.com/blog/2009/01/11/google-maps-in-a-twebbrowser-from-delphi-directions/. Baixe o programa de demonstração em: http://www.jasontpenny.com/Delphi/GoogleMapsDirectionsTest.zip

Agora que tenho por onde começar, irei fazer alguns ajustes para que fique da forma que eu necessito utilizando o Delphi XE2 trial.

Quando se execua a demonstração pela primeira vez, vemos o seguinte:

Primeiro, irei traduzir alguns captions e testar uma rota, conforme figura abaixo:

Ok, funcionou perfeitamente. Mas atente para alguns detalhes:

  • O mapa mostra alguns problemas com acentuação;
  • A distância total é mostrada na caixa de “passos” (steps). A distância devolvida também poderá variar, visto que depende do step em que se encontra o processo atual;
  • Ao abrir o mapa vai para um endereço que não nos interessa. O interessante é que ele abra diretamente sobre o Brasil.

Vamos corrigir o erro da acentuação e o posicionamento inicial. Localize a procedure LoadDefaultGoogleMapsDocument da unit uWBGoogleMaps:

Analisando o código acima, verificamos que:

  • O content da tag meta não informa o charset;
  • E o GLatLng (latitude e longitude) do método setCenter não está direcionado para o local que desejamos. O método setCenter pega a Latitude, Longitude e o Zoom.
  • Vamos então, inserir o charset e colocar as configurações que centralizam o mapa do Brasil na tela. Faça conforme figura abaixo:

    Execute para visualizar as alterações:

    Só falta agora pegar a distância total. Para isso, no form fDirections, insira um label e um edit:

    Localize a procedure CopyRight e insira o código:

          if frmDirections.edDistancia.Text = emptystr then
          begin
              frmDirections.edDistancia.Text := RemoveHTML(wp.RouteDistanceHTML);
          end;
    

    Este código deve ser inserido antes do for da procedure CopyRight, conforme figura abaixo:

    Agora, o teste:

    O segundo “para” fica sem uso em nosso teste, visto que mesmo que fosse necessário ter uma segunda rota, no exemplo acima sempre iria pegar a distância do primeiro passo. E como isso já resolve o meu problema, paramos por aqui.

    Espero que este post tenha sido útil.

    Desenvolvedor de software desde 1995. Em 1998, abriu sua própria empresa, a Lukas Sistemas, desde então passou a atender diversas empresas, principalmente autopeças. Apaixonado por Delphi, porém não o impede de flertar com outras linguagens sempre que possível. Mora na cidade de Balsas/MA com sua esposa e dois filhos.

13 thoughts on “Delphi e Google Maps JavaScript API”

  1. Boa tarde, parabéns ficou muito o artigo.
    estou estudando sistemas de informação e estou para iniciar um projeto interdisciplinar onde vou desenvolver um sistema para Moto táxi e pretendo usar o calculo das distancias através deste exemplo, isso irá me ajudar muito.

    teria como deixar seu e-mail caso me surja alguma duvida?
    desde já agradeço

  2. Olá Luiz, venho aqui entao postar duvidas.rssrs..
    Entao, eu ainda nao consegui somar as distancias total se houver varios pontos na rota, tipo total := A+B+C.
    e o zoom da pagina de acordo com a rota mas automaticamente calculando (nao deixando fixo no codigo).
    Tem como deixar o listbox, igual ao site do google com os endereços com a distancia do ponto ex: 1. rua tal, numero tal – 4 km.
    e se nao for te alugar muito, como ele monta a rota, com certeza ele tem a rota mais curta, rota mais rapida e etcs, tem como eu vizualizar isso e escolher um tipo de rota, e tambem poder no mapa mostrado mudar a rota puxando algum ponto do mapa para ele traçar um novo trajeto e mudar nos listbox e edits…. q to procurando na net, e nao to achando muita coisa pra me ajudar, isso eu sou novo ainda e quero me aprofundar, mas no momento apenas as coisas mais basicas…
    Obrigado….

    1. Luiz, consegui aqui traçar varios pontos, e somar as distancias certinho…. mostrar as ruas com a distancia tb igual ao google…
      Agora, só nao sei mesmo e to procurando, como eu manipular as rotas puxando igual ao google e mudar todos os dados…..
      Desculpa perguntar e depois ja ter a resposta, é q vou perguntando e ao mesmo tempo procurando e modificando…rs…..
      Obrigado….

  3. Bom dia.

    Tenho esse exemplo a algum tempo, porem hoje foram realizar uma pesquisa de distancias e está reclamando da chave da API do google e se me lembro bem dentro dos fontes ele utiliza um esquema pra rodar local assim o google não reclama a chave da API porem agora está reclamando.

    Alguem poderia dar uma ajuda??

    Obrigado desde já a todos.

  4. Luiz, gostei muito do trabalho acima apresentado. Gostaria de saber se existe algum serviço da Google que faça o calculo de uma rota onde informamos diversos pontos de passagens e o serviço retorne com a melhor rota a ser percorrida.

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.