5568 sujets

Sémantique web et HTML

Bonjour,
Débutant en Html, Javascript,CSS, ...., j'essaie d'écrire un petit programme mettant en oeuvre la géolocalisation. Tout marche bien sur mon PC, que ce soit avec IE, Chrome ou Firefox, par contre, impossible de faire fonctionner le même programme sur mon Ipad 2 et Safari (Wifi ou 3G).
Y -a-t-il des spécificités liées à Safari ou à l'Ipad 2 ?
Si oui, je suis preneur de toute information sur le sujet.
Merci à l'avance.
Bonjour et bienvenue sur le forum, Batybaty Smiley smile

A priori, pas de problème particulier à ma connaissance. N'y aurait-il pas un souci d'accès à la geolocalisation de l'appareil ? Est-elle activée/autorisée ?

Tu n'as pas précisé, mais je suppose que tu utilise bien la géolocalisation HTML5 ?
Merci, pour la géo localisation sur IPad, oui elle est autorisée, pour html ou html5, je vais vérifier...
Batybaty a écrit :
Bonjour,
Y -a-t-il des spécificités liées à Safari ou à l'Ipad 2 ?


Bonjour,

Chaque navigateur web embarque des fonctions de géolocalisation. Certains navigateurs n'ont pas les APIs embarqués.

Sur l'iPad vous avez quel navigateur?

A+
Pour tester ce problème de géolocalisation, j'ai copié le code suivant sur le tutoriel de Jonathan Verrecchia sur html5. Quand je transfère sur mon Ipad 2 ce code qui fonctionne correctement sur Firefox, j'obtiens bien l 'affichage de la carte de démarrage, mais pas la carte correspondant à la localisation ni le point de localisation :

<!doctype html>
<!--html xmlns="http://www.w3.org/1999/xhtml"-->
<html xmlns="http://www.w3.org/TR/2014/PR-html5-20140916/">
<html lang="fr">
<head>
<title>Géolocalisation</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100% ; width:100%;}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript">
var previousPosition = null;
function initialize() {
map = new google.maps.Map(document.getElementById("map_canvas"), {
zoom: 10,
center: new google.maps.LatLng(46.71559, 0.38836),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
}
if (navigator.geolocation){
var watchId = navigator.geolocation.watchPosition(successCallback, null, {enableHighAccuracy:true});
}
else{
alert("Votre navigateur ne prend pas en compte la géolocalisation HTML5");
}
function successCallback(position){
map.panTo(new google.maps.LatLng(position.coords.latitude, position.coords.longitude));
var marker = new google.maps.Marker({
position: new google.maps.LatLng(position.coords.latitude, position.coords.longitude),
map: map
});
if (previousPosition){
var newLineCoordinates = [
new google.maps.LatLng(previousPosition.coords.latitude, previousPosition.coords.longitude),
new google.maps.LatLng(position.coords.latitude, position.coords.longitude)];
var newLine = new google.maps.Polyline({
path: newLineCoordinates,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
newLine.setMap(map);
}
previousPosition = position;
};
</script>
</head>
<body onLoad="initialize()">
<div id="map_canvas"></div>
</body>
</html>