..


Links Patrocinados

Geolocalização com HTML5 e javascript. Integração com Google Maps

Artigo escrito por Max Bossi
Página 1 de 3

Produtos novos que estão sendo introduzidas com HTML5 são muitos e alguns particularmente interessantes. Entre estes destaca-se, sem dúvida, o apoio à geolocalização, que pode detectar automaticamente a localização geográfica do usuário através do browser.

Utilizando geolocation, de fato, com suporte para navegadores HTML5 são capazes de rastrear a localização do usuário usando o endereço IP atribuído pelo ISP sua conexão, a proximidade com a comunicação celular (para conexão móvel) ou através do " antena GPS pode ser integrado no dispositivo. A posição de detecção georafica, é claro, ocorre apenas após o consentimento explícito da pessoa em causa (que será notificado da solicitação da página web para fazer o rastreamento da posição, um pedido que será capaz de consentimento ou não).

A localização retornado pelo browser é expressa pelas suas coordenadas (latitude e longitude), que pode então ser usada por JavaScript. A API de geolocalização novo é baseado em uma nova propriedade do objeto de navegação: navigator.geolocation.

A fim de verificar se o navegador oferece suporte para estas novas API para HTML5 é suficiente, portanto, condicional fazer uma chamada assim:






 if (navigator.geolocation) {



  



 / Browser pronto / com suporte para HTML5 geolocalização







 Else {}



  



 / / Não há suporte para geolocalização







 }



Aqui está um código Javascript simples (para ser inserido no cabeçalho da página) para a detecção de coordenadas geográficas do usuário:






 if (navigator.geolocation) {



  



 navigator.geolocation.getCurrentPosition (mia_posizione);







 Else {}



  



 alert ('A geo-localização não é possível');







 }









 mia_posizione function () {



  



 var lat = position.coords.latitude;



  



 var lon = position.coords.longitude;



  



 document.getElementById ('location') innerHTML = 'A posição do seu: ". lat + +', '+ lon;

  





 }



No corpo da página, não só têm que inserir um elemento de "posição" id dentro do qual as coordenadas do usuário serão gravados.

Para ver um exemplo de trabalho , clique aqui .

GetCurrentPosition função ()

Como você pode ver se seu browser suporta veias getCurrentPosition Geolocation chamou a função () que, no nosso exemplo, um argumento é passado como o callback em caso de sucesso.
Na verdade isso funciona admite três parâmetros:

  • callback em caso de sucesso;
  • De retorno de chamada em caso de falha;
  • opções:
    • enableHighAccuracy: verdadeiro ou falso, é solicitar o dispositivo para enviar o local com o maior nível de precisão (attivamndo, por exemplo, o dispositivo GPS);
    • timeout: tempo máximo de espera para a detecção da posição (em milissegundos);
    • maximumAge: idade máxima após o qual a detecção deve ser realizada nuvo rastreamento posição;

Aqui está um exemplo do uso de um getCurrentPosition () com todos os três parâmetros permitidos:

 



 navigator.geolocation.getCurrentPosition (



  



 success_callback, error_callback, {enableHighAccuracy: false});

 
Na mesma categoria ...
E-Learning
CSS (Curso) CSS (Curso)
Web Design e Acessibilidade de acordo com a W3C CSS e XHTML. A partir de 29 €.
HTML (Curso) HTML (Curso)
A linguagem de marcação para a Web a partir de 29 €.
Javascript (Curso) Javascript (Curso)
Completo guia para client-side scripting. A partir de 39 €.
Links Patrocinados