Como responder a atualizações de localização usando HTML5 (aplicativos da Windows Store em JavaScript e HTML)

Este tópico mostra como responder as alterações na posição geográfica do usuário, usando a API de Geolocalização W3C em HTML5.

Pré-requisitos

Você deve estar familiarizado com HTML e JavaScript.

Instruções

Etapa 1: Abrir o Microsoft Visual Studio 2012

Abra uma instância do Visual Studio 2012.

Etapa 2: Verifique se o local está habilitado

Abra o Painel de controle, escolha Privacidade e configure Permitir aplicativos para usar o meu local como Ativado.

Etapa 3: Criar um novo projeto

Na caixa de diálogo Novo projeto, escolha um aplicativo em branco nos tipos de projeto JavaScript.

Etapa 4: Declare o recurso do local

Clique duas vezes em package.appxmanifest no Gerenciador de Soluções. Selecione a guia Recursos. Verifique o Local na lista de Recursos.

Etapa 5: Insira o aplicativo JavaScript e HTML

Abra o seu arquivo Default.html e copie o seguinte HTML para este arquivo (substituindo o seu conteúdo original).

JavaScript


<!DOCTYPE html>
<html>
<head>
<title>W3C Geolocation API Example</title>

<script type="text/javascript">
var loc = null;
var watchId;

    function watchloc() {
        if (loc == null) {
            loc = window.navigator.geolocation;
        }
        if (loc != null){
            watchId = loc.watchPosition(successCallback);
        }
    }
    
    function stopwatching() {
        loc.removeEventListener(watchId);
    }
    
    function successCallback(pos) {
        document.getElementById('latitude').innerHTML = pos.coords.latitude;
        document.getElementById('longitude').innerHTML = pos.coords.longitude;
        document.getElementById('accuracy').innerHTML = pos.coords.accuracy;
    }
    
    function errorCallback(error) {
        var strMessage = "";

        // Check for known errors
        switch (error.code) {
            case error.PERMISSION_DENIED:
                strMessage = "Access to your location is turned off. "  +
                    "Change your settings to turn it back on.";
                break;
            case error.POSITION_UNAVAILABLE:
                strMessage = "Data from location services is " + 
                    "currently unavailable.";
                break;
            case error.TIMEOUT:
                strMessage = "Location could not be determined " +
                    "within a specified timeout period.";
                break;
            default:
                break;
        }
        document.getElementById("status").innerHTML = strMessage;
    }
</script>
</head>

<body>
Geolocation Event Sample<br />
<br />

<input type="button" onclick="watchloc()" value="Watch Location" /><br />
<input type="button" onclick="stopwatching()" value="Stop watching" /><br />
Latitude: <span id="latitude">Waiting for update...</span><br />
Longitude: <span id="longitude">Waiting for update...</span><br />
Accuracy: <span id="accuracy">Waiting for update...</span><br />
<span> id="status"></span>
</body>
</html>

Etapa 6: Construir o aplicativo

No menu Construir, clique em Construir solução para construir o projeto.

Etapa 7: Testar o aplicativo

No menu Depuração, clique em Iniciar depuração para testar a solução.
A primeira vez que você executar a amostra, você obterá uma solicitação que pergunta se o aplicativo pode usar o local. Escolha a opção Permitir.
Clique no botão Observar local para obter o local atual.

Observação Se os dados de localização não forem exibidos, verifique o seguinte:

Certifique-se de ter habilitado o acesso à localização abrindo package.appxmanifest no Gerenciador de Soluções e marcando Localização na guia Recursos.
Se o administrador tiver desabilitado os serviços de localização, o aplicativo não poderá acessar a localização do usuário. No Painel de Controle da área de trabalho, abra Alterar Configurações de Local e veja se a opção Ativar a plataforma do Windows Location está selecionada.

Comentários

Você deve testar as atualizações do local usando um computador habilitado com Wi-Fi porque o Provedor do Local do Windows usa a triangulação Wi-Fi para solucionar o local. Quando o local é solucionado, os eventos que indicam as atualizações são elevados. Se você usa um computador que não tenha Wi-Fi habilitado, o local terá como base o endereço de IP e você pode não conseguir os eventos de atualização do local.

Tópicos relacionados

Amostra de geolocalização