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 :

Javascript - valeur div/span


Sujet :

JavaScript

  1. #1
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut Javascript - valeur div/span
    Bonjour,

    J'ai un problème avec javascript :

    J'utilise la géolocalisation html5 dans un 1er script sur ma page, ce qui m'intéresse c'est 'Latm' & 'LongM' ici :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    document.getElementById("LatM").innerHTML = position.coords.latitude; 
    document.getElementById("LongM").innerHTML = position.coords.longitude;
    que j'affiche comme ça :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    Lat : <span id="LatM"></span> 
    Long : <span id="LongM"></span>

    ou en <div id=LatM></div>

    J'aimerais récupérer les valeurs des 'span id' pour les injecter dans un 2eme script sur la même page, mais je n'obtiens rien de valable (des null, des objetHTMLSpanElement....)

    Avez vous une solution ?
    Merci d'avance


    ps : j'ai essayé quelque chose comme ça mais sans résultat ->
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    X = document.getElementById("LatM").value;

  2. #2
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    bonjour;

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    X = document.getElementById("LatM").value
    pourtant tu as écrit la réponse dans ta question
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    X = document.getElementById("LatM").innerHTML

  3. #3
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    Je dois faire une erreur quelque part parce qu'avec X = document.getElementById("LatM").innerHTML j'obtiens [object HTMLSpanElement]

    edit : LatM et LongM sont dans function successCallback(position) - Est ce que ça a une incidence ?

  4. #4
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    <body onload="alert(document.getElementById('LatM').innerHTML)">
    <div>	
    	<span id="LatM">Blabla</span> 
    </div>
     
    </body>
    affiche "blabla" dans une boite de dialogue.

    Citation Envoyé par Web-Greg
    edit : LatM et LongM sont dans function successCallback(position) - Est ce que ça a une incidence ?
    Tout dépend de ce que fait cette fonction. On peut voir les codes HTMl et javascript ?

  5. #5
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    Quand j'essaye d'afficher <div id="LatM"></div>, j'obtiens bien la Latitude (je suis bien géolocalisé)

    le 1er script (géolocalisation html5):

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    if (navigator.geolocation)
    var watchId = navigator.geolocation.watchPosition(successCallback,
                                      errorCallback,
                                      {enableHighAccuracy:true,
                                      timeout:100000,
                                      maximumAge:0});
    								  else
      alert("Votre navigateur ne prend pas en compte la géolocalisation HTML5");
     
    function successCallback(position){
          document.getElementById("LatM").innerHTML = position.coords.latitude;
          document.getElementById("LongM").innerHTML = position.coords.longitude;
         };  
    };
    Le second script est une succession de calcul :

    // je récupère des données :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    var Lat1 = 43.846839;
    var Long1 = 5.107955;
     
    X = document.getElementById("LatM").innerHTML; 
    Y = document.getElementById("LongM").innerHTML;
    et ensuite mon calcul qui me sert à placer un point sur une image...


    En bas de page, j'affiche le résultat du 1er script :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
        Lat : <span id="LatM"></span>
        Long : <span id="LongM"></span>

    et le résultat de mon second script :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    document.write('Lat1 : '+ Lat1+'<br>');
    document.write('Long1 : '+ Long1+'<br>');

  6. #6
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    Citation Envoyé par Web-Greg Voir le message
    Quand j'essaye d'afficher <div id="LatM"></div>, j'obtiens bien la Latitude (je suis bien géolocalisé)

    le 1er script (géolocalisation html5):

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    if (navigator.geolocation)
    var watchId = navigator.geolocation.watchPosition(successCallback,
                                      errorCallback,
                                      {enableHighAccuracy:true,
                                      timeout:100000,
                                      maximumAge:0});
    								  else
      alert("Votre navigateur ne prend pas en compte la géolocalisation HTML5");
     
    function successCallback(position){
          document.getElementById("LatM").innerHTML = position.coords.latitude;
          document.getElementById("LongM").innerHTML = position.coords.longitude;
         };  
    };
    je ne porterai pas de jugement sur cette première partie car ces sont des choses que je ne connais pas. Le seul point qui m'intrigue c'est la variable position qui est passée en paramètre à ta fonction successCallback.




    Citation Envoyé par Web-Greg Voir le message
    Le second script est une succession de calculs:

    // je récupère des données :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    var Lat1 = 43.846839;
    var Long1 = 5.107955;
     
    X = document.getElementById("LatM").innerHTML; 
    Y = document.getElementById("LongM").innerHTML;
    et ensuite mon calcul qui me sert à placer un point sur une image...
    là il faut que tu gardes à l'esprit que innerHTML retourne une chaine de caractères. Donc si tu veux réaliser des calculs il faut transformer ces chaines en nombres :
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    var Xstr, Ystr;
    var X, Y;
    Xstr = document.getElementById("LatM").innerHTML;       // chaine de caractères
    Ystr = document.getElementById("LongM").innerHTML;    // chaine de caractères
    X = parseFloat(Xstr);     // conversion en nombre flottant
    Y = parseFloat(Ystr);      // conversion en nombre flottant
    // tes calculs




    Citation Envoyé par Web-Greg Voir le message
    et le résultat de mon second script :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    document.write('Lat1 : '+ Lat1+'<br>');
    document.write('Long1 : '+ Long1+'<br>');
    ah... document.write(). Cette fonction est assez particulière et pose souvent des problèmes.
    Est-ce que tu appelles cette méthode dans une fonction javascript déclarée entre les balises <head> de ta page ? Si oui, la source de ton problème est là.
    Je t'invite à lire ce billet de Bovino à propos de cette fonction. Comprendre document.write en javascript

    Maintenant, je ne peux en dire plus car je ne sais pas comment sont organisés ton javascript et HTML dans ta page.

  7. #7
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    Merci pour ton aide !! Et merci pour le .innerHTML, je ne savais pas.

    Je viens de faire un test avec :

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    var Xstr, Ystr;
    var X, Y;
    Xstr = document.getElementById("LatM").innerHTML;       // chaine de caractères
    Ystr = document.getElementById("LongM").innerHTML;    // chaine de caractères
    X = parseFloat(Xstr);     // conversion en nombre flottant
    Y = parseFloat(Ystr);      // conversion en nombre flottant
    // tes calculs

    ça me retourne :

    LatM : undefined
    LongM : undefined

    Comme tu le dis, je pense que le soucis vient de la variable position qui est passée en paramètre à la fonction successCallback.
    Je trouve étrange que ça s'affiche avec un div alors qu'il n'y a pas de réponse quand on l'appelle dans le second script :-/

    Je me sers des document.write pour avoir un aperçu des résultats des calculs, je vais peut être les virer si ça pose problème...

    Une autre question d'ailleurs : Mon calcul (une simple regle de 3 pour convertir les coordonnées gps en pixels), une fois qu'il sera opérationnel me renvoi : Lmarker et Hmarker. Dans mon html, j'affiche une image et par dessus j'appelle un point qui definie ma position. Ce point est sous cette forme
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <li data-marker-left="Lmarker" data-marker-top="Hmarker">

    J'imagine que ce serait trop simple sous cette forme, comment reporter le résultat de mon calcul dans le corps de ma page html ?

  8. #8
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    Pour déverminer ton code procède par étapes. Déjà, supprime le document.write() qui va pourrir ta page, remplace le par des alert().

    Essaye une géolocalisation "simple" : pas de calcul, affiche simplement les coordonnées et le code de ta page HTML est réduit au minimum avec les 2 span pour la latitude et la longitude. J'ai trouvé ce tutoriel sur dvp :
    http://debray-jerome.developpez.com/...tion-en-html5/

    Je remarque les fonctions successFunction, errorFunction, etc. sont déclarées avant l'appel à l'API de géolocalisation navigator.geolocation. (voir II).
    Voici les spécifications du W3C sur cet API : http://www.w3.org/TR/geolocation-API/

  9. #9
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    Bonjour,

    J'ai essayé avec un code simple :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    <script>
    function Geolocation() {		
    	if (navigator.geolocation) {
    		navigator.geolocation.getCurrentPosition(handlePosition);
    	} else {
    		document.getElementById("status").innerHTML = "HTML5 Geolocation is not supported in your browser.";
    	}		
    }
    function handlePosition(position) {
    	var LatM = position.coords.latitude;
    	var LongM = position.coords.longitude;
    	var acc = position.coords.accuracy;
    	document.getElementById("pos").innerHTML = "Votre position : ";
    	document.getElementById("LatM").innerHTML = "latitude : " + LatM;
    	document.getElementById("LongM").innerHTML = "longitude : " + LongM;
    	document.getElementById("acc").innerHTML = "accuracy : " + acc + " m";
    }
    </script>
    Ça fonctionne, je récupère bien ma latitude et ma longitude :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
      <span id="LatM"></span><br>
      <span id="LongM"></span><br>

    J'ai du ajouter body onload="Geolocation();" pour un résultat.

    Prochaine étape, ajouter LatM & LongM dans le 2eme script : LatM : undefined

    edit : en fait j'ai l'impression que mon problème depuis le début est la récupération des span. Les 2 scripts marchent bien séparément mais impossible de récupérer les valeurs de LAtM dans le second script (le calcul)

  10. #10
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    La première étape est franchie et le code valide.

    Montre nous maintenant le code complet de ce second script. Il n'y a pas de raison que tu ne puisses pas récupérer les valeurs.

  11. #11
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    Merci encore !!

    1er script :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
      <!-- Géolocalisation -->
    <script>
    function Geolocation() {		
    	if (navigator.geolocation) {
    		navigator.geolocation.getCurrentPosition(handlePosition);
    	} else {
    		document.getElementById("status").innerHTML = "HTML5 Geolocation is not supported in your browser.";
    	}		
    }
    function handlePosition(position) {
    	var LatM = position.coords.latitude;
    	var LongM = position.coords.longitude;
    	var acc = position.coords.accuracy;
    	document.getElementById("pos").innerHTML = "Votre position : ";
    	document.getElementById("LatM").innerHTML = "latitude : " + LatM;
    	document.getElementById("LongM").innerHTML = "longitude : " + LongM;
    	document.getElementById("acc").innerHTML = "accuracy : " + acc + " m";
     
    }
    </script>
    	<!-- /Géolocalisation -->
    2eme script :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    	<!-- Calcul -->
    <script type="text/javascript">
        var Lat1 = 43.846839;
    	var Long1 = 5.107955;
     
    	var Lat2 = 43.844239;
    	var Long2 = 5.112307;
     
    	var imgwidth = 836;
    	var imgheight = 667;
     
     
    	//var Xstr, Ystr;
    	//var X, Y;
    	//Xstr = document.getElementById("LatM").innerHTML;       // chaine de caractères
    	//Ystr = document.getElementById("LongM").innerHTML;    // chaine de caractères
    	//X = parseFloat(Xstr);     // conversion en nombre flottant
    	//Y = parseFloat(Ystr);      // conversion en nombre flottant
    	var X = 43.8453794;
    	var Y = 5.1101713;
    	//var  X = LatM;
    	//var  Y = LongM;
     
     
    	//if (LongM<Long1 && LongM>Long2) {alert("Vous n'êtes pas dans la zone !");}
    	//else {Hmap= Math.abs(Long2 - Long1);}
    	var Hmap = Math.abs(Long2 - Long1);
     
    	//if (LatM<Lat1 && LatM>Lat2) {alert("Vous n'êtes pas dans la zone !");}
    	//else {Lmap= Math.abs(Lat2 - Lat1);}
    	var Lmap= Math.abs(Lat2 - Lat1);	
     
    	var LPosRel = Math.abs(Y - Long1);
    	var HPosRel = Math.abs(X - Lat1);
     
    	var ResL = LPosRel / Hmap;
    	var ResH = HPosRel / Lmap;
     
    	var Lmarker = ResL * imgwidth;    // résultat en pixel pour placer le Marker sur l'image.
    	var Hmarker = ResH * imgheight;
     
    </script>	
    <!--   /calcul   -->
    Dans la page en html, j'appelle le Marqueur sur mon image comme ça :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    <!-- MARQUEUR POSITION --> 
    			<li 
    			data-marker-type="tooltip" 
    			data-show-content="yes" 
    			data-reg-point="centerbottom" 
    			data-marker-normal-state-path="marker1.png" 
    			data-marker-selected-state-path="marker1-rollover.png" 
    			data-marker-left="Lmarker"    <!-- Ici résultat en pixel --> 
    			data-marker-top="Hmarker" 
    			data-marker-width="28" 
    			data-marker-height="36" 
    			data-show-after-zoom-factor="0">
    				<div class="InfoDiv">Vous etes ici</div>
    			</li>            
                <!-- --FIN POSITION -->

  12. #12
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    le second script n'est pas dans une fonction ????

  13. #13
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    au départ si, j'avais englobé tout le calcul dans une function calcul() .

    Je l'ai pas copier dans le msg précédent car je suis loin d’être sur de moi sur ce coup là :-/

  14. #14
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    Je viens de voir quelque chose. Dans la 1ère partie du script tu as écrit :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    	document.getElementById("pos").innerHTML = "Votre position : ";
    	document.getElementById("LatM").innerHTML = "latitude : " + LatM;
    	document.getElementById("LongM").innerHTML = "longitude : " + LongM;
    	document.getElementById("acc").innerHTML = "accuracy : " + acc + " m";
    or si ensuite tu fais par exemple un document.getElementById("LongM").innerHTML tu récupères tout le texte contenu dans le span à savoir
    longitude : 5.1101713
    et dans ce cas le résultat du parseFloat() sera NaN (not a number) ce qui est normal puisque tu as du texte ("longitude : ") en plus du nombre ("5.1101713").

  15. #15
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    ok merci, 1er erreur rectifiée...

  16. #16
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    mets ton 2nd script dans une fonction qui sera appelée lorsque tu cliqueras sur un bouton. Après chaque résultat place un alert() pour vérifier le contenu de tes variables.


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    	var ResL = LPosRel / Hmap;
    	var ResH = HPosRel / Lmap;
    Pour ces deux lignes de code, ajoute peut-être un test sur Hmap et Lmap car si ces valeurs sont nulles le script va planter.

    Ensuite réactive le getElementById() en faisant attention où tu placeras les commentaires.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    	//var Xstr, Ystr;
    	//var X, Y;
    	//Xstr = document.getElementById("LatM").innerHTML;       // chaine de caractères
    	//Ystr = document.getElementById("LongM").innerHTML;    // chaine de caractères
    	//X = parseFloat(Xstr);     // conversion en nombre flottant
    	//Y = parseFloat(Ystr);      // conversion en nombre flottant
    	var X = 43.8453794;
    	var Y = 5.1101713;
    	//var  X = LatM;
    	//var  Y = LongM;
    devient :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    	var Xstr, Ystr;
    	var X, Y;
    	Xstr = document.getElementById("LatM").innerHTML;       // chaine de caractères
    	Ystr = document.getElementById("LongM").innerHTML;    // chaine de caractères
    	X = parseFloat(Xstr);     // conversion en nombre flottant
    	Y = parseFloat(Ystr);      // conversion en nombre flottant
    	//var X = 43.8453794;
    	//var Y = 5.1101713;
    	//var  X = LatM;
    	//var  Y = LongM;
    Donc là, sauf erreur, si tu places un alert() sur Xstr, Ystr, X et Y tu dois avoir une valeur.

    J'ai testé la 1ère partie de ton code. Cela fonctionne mais le résultat est un peu long à s'afficher. Donc si tu cliques sur le bouton avant l'affichage du résultat à l'écran tes alert() de ta fonction calcul() risquent de ne rien donner.

  17. #17
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    Ok pour la fonction appelée par un bouton :

    1er script long à s'afficher :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    var LatM = position.coords.latitude;
    	var LongM = position.coords.longitude;
     
     
    	document.getElementById("LatM").innerHTML = LatM;
    	document.getElementById("LongM").innerHTML = LongM;
    2eme script :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    <script>
    function calcul() {
     
        var Lat1 = 43.846839;
    	var Long1 = 5.107955;
    	alert(Long1);    // ici OK
     
    	var Lat2 = 43.844239;
    	var Long2 = 5.112307;
    	alert(Long2);   // ici OK
     
    	var imgwidth = 836;
    	var imgheight = 667;
    	alert(imgheight);   // ici OK
     
     
    	var Xstr, Ystr;
    	var X, Y;
    	Xstr = document.getElementById("LatM").innerHTML;       // chaine de caractères
    	Ystr = document.getElementById("LongM").innerHTML;    // chaine de caractères
    	X = parseFloat(Xstr);     // conversion en nombre flottant
    	Y = parseFloat(Ystr);      // conversion en nombre flottant
    	//var X = 43.8453794;
    	//var Y = 5.1101713;
    	alert(Xstr);  // ici champ vide
    	alert(Y);     // ici NaN
     
    	//if (LongM<Long1 && LongM>Long2) {alert("Vous n'êtes pas dans la zone !");}
    	//else {Hmap= Math.abs(Long2 - Long1);}
    	Hmap = Math.abs(Long2 - Long1);
     
    	//if (LatM<Lat1 && LatM>Lat2) {alert("Vous n'êtes pas dans la zone !");}
    	//else {Lmap= Math.abs(Lat2 - Lat1);}
    	Lmap = Math.abs(Lat2 - Lat1);
    	alert(Lmap);	
     
    	var LPosRel = Math.abs(Y - Long1);
    	var HPosRel = Math.abs(X - Lat1);
    	alert(HPosRel);
     
    	var ResL = LPosRel / Hmap;
    	var ResH = HPosRel / Lmap;
    	alert(ResH);
     
    	var Lmarker = ResL * imgwidth;    // résultat en pixel pour placer le Marker sur l'image.
    	var Hmarker = ResH * imgheight;
    	alert(Hmarker);
     
    	}
    </script>

  18. #18
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    Ha bizarre, en fait ça fonctionne mais à la condition que j'affiche les resultats de la géolocalisation comme ça dans ma page :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    <p id="status"></p>
    <h4 id="pos"></h3>
    <p id="LatM"></p>
    <p id="LongM"></p>
    <p id="acc"></p>

  19. #19
    Futur Membre du Club
    Homme Profil pro
    Webdesigner
    Inscrit en
    Avril 2014
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Vaucluse (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Avril 2014
    Messages : 24
    Points : 7
    Points
    7
    Par défaut
    Merci pour ton aide et pour le temps passé à résoudre mon problème , vraiment !!

    Je me permets une toute dernière question.

    Lmarker & Hmarker me renvoient bien un résultat.
    Comment je dois procéder pour insérer les résultats dans mon affichage du marker dans ma page html entre les guillemets :

    Je pense pas pouvoir afficher ça comme Lmat -> <p id="LatM"></p> :-(

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
     <!-- MARQUEUR POSITION --> 
    			<li 
    			data-marker-type="tooltip" 
    			data-show-content="yes" 
    			data-reg-point="centerbottom" 
    			data-marker-normal-state-path="marker1.png" 
    			data-marker-selected-state-path="marker1-rollover.png" 
    			data-marker-left="Lmarker"    <!-- Ici résultat en pixel --> 
    			data-marker-top="Hmarker" 
    			data-marker-width="28" 
    			data-marker-height="36" 
    			data-show-after-zoom-factor="0">
    				<div class="InfoDiv">Vous etes ici</div>
    			</li>            
                <!-- --FIN POSITION -->

  20. #20
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 646
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 646
    Points : 11 135
    Points
    11 135
    Par défaut
    En toute franchise je ne peux pas répondre à cette question.

    Mais je pense que tu peux faire comme ceci (note que j'ai ajouté l'attribut id à ta balise) :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    <li id="identifiantBalise"
    			data-marker-type="tooltip" 
    			data-show-content="yes" 
    			data-reg-point="centerbottom" 
    			data-marker-normal-state-path="marker1.png" 
    			data-marker-selected-state-path="marker1-rollover.png" 
    			data-marker-left="Lmarker"    
    			data-marker-top="Hmarker" 
    			data-marker-width="28" 
    			data-marker-height="36" 
    			data-show-after-zoom-factor="0">

    puis dans une fonction javascript (je pense à celle qui fait les caculs) :
    Code javscript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    document.getElementById("identifiantBalise").dataMarkerLeft = Lmarker + "px";
    document.getElementById("identifiantBalise").dataMarkerTop = Hmarker+ "px";
    tu remarqueras que j'ai supprimé les "-" de l'attribut et mis des majuscules.

+ Répondre à la discussion
Cette discussion est résolue.
Page 1 sur 2 12 DernièreDernière

Discussions similaires

  1. [PHP-JS] target menu javascript dans <div>
    Par tarang dans le forum Langage
    Réponses: 4
    Dernier message: 25/09/2007, 17h42
  2. div, span, imbrication et positionnement css
    Par bambou dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 28/04/2007, 18h17
  3. Valeur DIV
    Par licorne dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 04/01/2006, 17h06
  4. <div><span>
    Par pierrot10 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 25/09/2005, 20h34
  5. [javascript] valeur indéfinie
    Par MatMeuh dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 19/10/2004, 15h55

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