11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'ai un souci avec ce tout petit script.
Pouvez-vous m'aider svp ?
Pourquoi mon "alert" ne m'affiche pas les coordonnées gps ?
Comment faire pour y arriver ?

PS.
A tester uniquement sur un htpps !

D'avance, je vous en remercie.
Bon weekend à tous.


<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var x = document.getElementById("demo");
function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else { 
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}

function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude;
}
	
getLocation();
alert(x.innerHTML);
</script>

</body>
</html>
Il semblerait que tu aies repris le code d'exemple sur w3schools (en tout cas c'est le même). Il manque plus qu'à tester la présence d'erreur en ajoutant cette fonction en deuxième paramètre de getCurrentPosition :
function showError(error) {
    switch(error.code) {
        case error.PERMISSION_DENIED:
            x.innerHTML = "User denied the request for Geolocation."
            break;
        case error.POSITION_UNAVAILABLE:
            x.innerHTML = "Location information is unavailable."
            break;
        case error.TIMEOUT:
            x.innerHTML = "The request to get user location timed out."
            break;
        case error.UNKNOWN_ERROR:
            x.innerHTML = "An unknown error occurred."
            break;
    }
}
Bonsoir,

Je te remercie pour ton aide.

Mais, sachant que l'erreur ne venait pas de là, j'avais délibérément simplifié le code.
Que soit, je viens de vous déposer ci-dessous tout le code.
Hélàs, rien ne change avec mon souci...
Par hasard, auriez-vous une autre piste pour moi ?

Voici le lien dont parle Anymah.
Il est d'ailleurs possible d'insérer mon code, pour tester.


<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var x = document.getElementById("demo");
function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition, showError);
    } else { 
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}

function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude;
}
	
function showError(error) {
    switch(error.code) {
        case error.PERMISSION_DENIED:
            x.innerHTML = "User denied the request for Geolocation."
            break;
        case error.POSITION_UNAVAILABLE:
            x.innerHTML = "Location information is unavailable."
            break;
        case error.TIMEOUT:
            x.innerHTML = "The request to get user location timed out."
            break;
        case error.UNKNOWN_ERROR:
            x.innerHTML = "An unknown error occurred."
            break;
    }
}
	
getLocation();
alert(x.innerHTML);
</script>

</body>
</html>

Modifié par jytest (17 Jun 2017 - 23:44)
Okay désolé. J'ai pas fais attention à la manière dont tu voulais afficher les coordonnées. La fonction getCurrentLocation est asynchrone. Donc au moment où tu affiche l'alerte, elle n'a pas encore retourné de résultat. Tu peux y remédier facilement en déplaçant la ligne en question dans la fonction showPosition :

function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude;
    alert(x.innerHTML);
}

L'asynchronisme est omniprésent en Javascript. C'est un concept important à comprendre.