Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Google Maps API - Como você nunca viu.

Google Maps API - Como você nunca viu.

Evento: JsDay Campina Grande - PB

Palestra apresentada no Teatro UNIFACISA, falando sobre o funcionamento da API do Google Maps no Uber, 99Táxis e Easy Táxi, mostrando exemplos e sugestões.

Thulio Philipe

April 23, 2016
Tweet

More Decks by Thulio Philipe

Other Decks in Programming

Transcript

  1. Documentação 
 https://developers.google.com/maps/documentation/geocoding/intro "Geocodificação é o processo de conversão de

    endereços (rua, avenida, bairro) em coordenadas geográficas (latitude e longitude) que podem ser usadas para inserir marcadores em um mapa ou posicionar o mapa."
  2. Mostrar a localização do usuário no mapa Pegar a latitude

    e longitude para fazer qualquer coisa Traçar a rota entre dois ou mais pontos Detalhes sobre o endereço de onde o usuário está Pega as coordenadas e mostra o endereço
  3. Copie e cole o código Obtenha uma chave Adicione o

    script do google maps ao seu projeto https://maps.googleapis.com/maps/api/js?key=sua_key_aqui
  4. Documentação 
 https://developers.google.com/maps/documentation/distance-matrix/ "O serviço calcula a distância e duração

    de um curso/viagem entre várias origens e destinos, usando um determinado modo de viagem."
  5. Copie e cole o código Adquira uma chave de servidor

    (server key) Adicione o script do google maps ao seu projeto https://maps.googleapis.com/maps/api/js?key=sua_key_aqui
  6. Copie e cole o código Adquira uma chave de servidor

    (server key) Adicione o script do google maps ao seu projeto https://maps.googleapis.com/maps/api/js?key=sua_key_aqui
  7. ok, not_found, zero_results, max_waypoints_exceeded, invalid_request, over_query_limit, request_denied, unknow_error array com

    detalhes da geocodificação array com informações sobre as rotas informações detalhadas, passo-a-passo, distância e duração
  8. Exibir a localização Fornecer informações adicionais para o usuário do

    local que ele está Melhorar a experiência do usuário na sua aplicação (UX)
  9. Copie e cole o código Adquira uma chave Adicione o

    script do google maps ao seu projeto https://maps.googleapis.com/maps/api/js?key=sua_key_aqui
  10. var panorama = new google.maps.StreetViewPanorama( document.getElementById('pano'), { position: userPosition, pov:

    { heading: 34, pitch: 10 } }); ângulo de rotação horizontal e vertical elemento do html