IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Géolocalisation HTML5 + fonctions mobiles


Sujet :

JavaScript

  1. #1
    Membre éclairé
    Avatar de bricecol
    Homme Profil pro
    Consultant informatique
    Inscrit en
    Avril 2007
    Messages
    364
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Activité : Consultant informatique

    Informations forums :
    Inscription : Avril 2007
    Messages : 364
    Points : 654
    Points
    654
    Par défaut Géolocalisation HTML5 + fonctions mobiles
    Bonjour à tous.

    Je suis en train de créer une petite application web destinée exclusivement aux mobiles/tablettes dans laquelle je travaille sur l'élaboration d'un petit radar.

    L'utilisateur est donc au centre du radar et les autres utilisateurs s'affichent autour de lui, dans les 4 directions (et dans un périmètre limité, mais çà on s'en fou )

    Pour atteindre mon but, j'utilise les nouvelles fonctionnalités de HTML5. En particulier la géolocalisation :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    navigator.geolocation.getCurrentPosition(function(position){
        var lat=position.coords.latitude;
        var lng=position.coords.longitude;
        //...
      },null,{enableHighAccuracy:true});
    Dans l’extrait ci-dessus, on voit qu'on peut récupérer facilement la latitude et la longitude de l'utilisateur. J'ai bien testé ce point et c'est assez précis à ma grande surprise (env 3m, bref).

    Le problème, c'est que pour un radar il faut aussi l'orientation de l'utilisateur... Et là c'est plus compliqué...

    Avec la même fonction utilisée plus haut, les spécifications prévoient que l'on puisse récupérer l'orientation via
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    position.coords.heading
    exprimée avec un nombre de 0 à 360 (degré donc, 0 c'est le nord). Super, seulement mon android ne me renvoi rien, ni l'IPad de mon frère... Je lis donc la documentation et là j'ai 2 explications possibles :
    1. Il faut que la cible soit en déplacement pour déterminer sa direction... logique... mais faut-il une vitesse minimum ou une durée de déplacément ? Je ne sais pas. (J'ai bien bien essayer de marcher avec mon téléphone, rien ne se passe, point 2 alors ?)
    2. Certaines implémentations ne peuvent pas renvoyer cette information... donc çà renvoie null. Bon d'accord.


    D'abord, auriez-vous une idée sur ce problème ?
    Ensuite, dans le cas 1, une autre solution existe-t-il ?
    Dans le cas 2 une autre solution existe-t'il ?

    Merci pour votre aide !
    "Computers are like Old Testament gods ; Lots of rules and no mercy"
    [ Les ordinateurs sont comme les dieux de l’Ancien testament ; Beaucoup de règles et aucune pitié. ] Joseph Campbell

  2. #2
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 73
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Points : 22 933
    Points
    22 933
    Billets dans le blog
    125
    Par défaut
    Bonsoir

    Je viens de lire un tutoriel qui conseille :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    navigator.geolocation.watchPosition( function( position ){
    /*
    position.coords.latitude
    position.coords.longitude
    position.timestamp : l’heure à laquelle a été mise à jour la position
    position.coords.altitude : altitude de l’utilisateur
    position.coords.accuracy : précision des coordonnées
    position.coords.altitudeAccuracy : précision de l’altitude
    position.coords.heading : angle compris entre 0 et 360° par rapport au Nord (ce n’est pas aussi précis que la boussole interne d’un smartphone)
    position.coords.speed : vitesse de l’utilisateur par rapport à sa dernière position.
    */
    }, null, { enableHighAccuracy : true, timeout : 10000, maximumAge: 0 } );

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  3. #3
    Membre éclairé
    Avatar de bricecol
    Homme Profil pro
    Consultant informatique
    Inscrit en
    Avril 2007
    Messages
    364
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Activité : Consultant informatique

    Informations forums :
    Inscription : Avril 2007
    Messages : 364
    Points : 654
    Points
    654
    Par défaut
    Alors, que ce soit getCurrentPosition (que je peux rappeler moi-même avec un callback) ou watchPosition, les deux me renvoient null pour le heading justement (et ce peut importe les arguments enableHighAccuracy, timeout ou maximumAge...
    "Computers are like Old Testament gods ; Lots of rules and no mercy"
    [ Les ordinateurs sont comme les dieux de l’Ancien testament ; Beaucoup de règles et aucune pitié. ] Joseph Campbell

  4. #4
    Membre confirmé

    Profil pro
    Inscrit en
    Octobre 2010
    Messages
    311
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Octobre 2010
    Messages : 311
    Points : 545
    Points
    545
    Par défaut
    Salut !

    Le terme heading est une notion provenant du milieu maritime, cela désigne bien l’orientation (ou cap) d’un bateau de 0° 359° dans le sens horaire ( 0° : le nord, 90° : l’est, 180° : le sud, 270 : l’ouest). Le heading est un terme qu’il ne faut surtout pas confondre avec le Course over Ground , qui lui est la direction de déplacement, le heading designe donc l’orientation de ton smartphone et le course over ground la direction de déplacement de l’utilisateur du smartphone.

    Le course over ground peut donc ce calculé à partir d’un historique d’au moins 2 positions, le heading lui se mesure à partir d’un équipement dédié, tel un gyro-compas pour les bateaux, sur un smartphone tu peux, peut-être, le déduire avec L’API DeviceOrientation Event.

    Si tu souhaites calculer le course over ground, fait attention à 2 choses :
    1. Les puces GPS sont plus précisent pour les cibles en mouvement, que pour les cibles immobiles. Enregistre ta position GPS en étant immobile, tu remarqueras une dispersion des positions dans un rayon supérieur à 3 m.
    2. La position GPS étant des coordonnées sphériques ( 2 angles) , les latitudes et longitude ne forme par un repère orthonormé , il faut, donc, effectuer une projection avant d’extraire l’angle.


    J’ai retranscris en langages JavaScript une fonction de calcul de course over ground que j’utilise pour un extracteur de piste radar :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    var EARTH_RADIUS = 111319.49079327357264771338267056;
    var RAD2DEG = 57.295779513082320876798154814105;
     
    function ComputeCoG(p0,p1)
    {
    	var vector = {
    		x : (p0.Longitude - p1.Longitude) * Math.cos(p0.Latitude/RAD2DEG + Math.PI) * EARTH_RADIUS,
    		y : (p1.Latitude - p0.Latitude)* EARTH_RADIUS
    	}
    	var angle = 90 - (Math.atan2(vector.y,vector.x) * RAD2DEG);		
    	return (angle + 360) % 360;
    }
     
    console.log(ComputeCoG({Latitude: 43.39647, Longitude : 3.67874},{ Latitude: 43.39899, Longitude : 3.73017}));
    ShaderElement : Bénéficier de l’accélération graphique simplement par une nouvelle balise HTML <shader>
    ODE.js : portage JavaScript du célèbre moteur physique 3D Open Dynamics Engine

  5. #5
    Membre éclairé
    Avatar de bricecol
    Homme Profil pro
    Consultant informatique
    Inscrit en
    Avril 2007
    Messages
    364
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Activité : Consultant informatique

    Informations forums :
    Inscription : Avril 2007
    Messages : 364
    Points : 654
    Points
    654
    Par défaut
    p3ga5e, merci pour ta réponse.

    Effectivement, voici ce que j'ai pu trouver grâce à ta piste :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    if(window.DeviceOrientationEvent){
      window.addEventListener('deviceorientation',function(){
        console.log(event.alpha+','+event.beta+','+event.gamma);
      },true);
    }else if(window.DeviceMotionEvent){
      window.addEventListener('devicemotion',function(){
        console.log(event.acceleration.x*2+','+event.acceleration.y*2+','+event.acceleration.z*2);
      },true);
    }else{
      window.addEventListener('MozOrientation',function(){
        console.log(orientation.x*50+','+orientation.y*50+','+orientation.z*50);
      },true);
    }
    Mais je ne l'ai pas encore testé, je fais çà dès que possible et j'annote mon post pour donner la réponse

    Alors, j'ai abandonnée l'idée de l'orientation. J'affiche le nord et charge à la personne d'être bien orientée

    C'est déjà assez difficile de dessiner correctement ce radar sans en plus ajouter un mouvement de rotation dynamique en fonction de l'orientation !
    "Computers are like Old Testament gods ; Lots of rules and no mercy"
    [ Les ordinateurs sont comme les dieux de l’Ancien testament ; Beaucoup de règles et aucune pitié. ] Joseph Campbell

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. app windows metro js+html5 fonction pas toujours exécutée
    Par flink88 dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 11/08/2014, 10h12
  2. Géolocalisation sur application Mobile
    Par Paradisma dans le forum Windows Phone
    Réponses: 8
    Dernier message: 20/06/2011, 17h36

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo