Variable javascript dans une balise <li>
Bonjour,
J'utilise la géolocalisation html5 pour déterminer l'emplacement de l'utilisateur sur une image.
Le 1er script basé sur l'API google :
Code:
1
2
3
4
5
6
| function successCallback(position){
var LatM = position.coords.latitude;
var LongM = position.coords.longitude;
document.getElementById("LatM").innerHTML = position.coords.latitude;
document.getElementById("LongM").innerHTML = position.coords.longitude;
}; |
J'obtiens bien la longitude et latitude de l'utilisateur :
Mon 2eme script est une règle de 3 pour convertir les coordonnées géographique en pixel
Code:
1
2
3
4
5
6
| function calcul() {
var Lmarker = ResL * imgwidth; // résultat en pixel pour placer le Marker sur l'image.
var Hmarker = ResH * imgheight;
document.getElementById("repereLpos").innerHTML = Lmarker;
document.getElementById("repereHpos").innerHTML = Hmarker;
} |
J'obtiens bien la hauteur et la largeur en pixel :
Code:
1
2
3
4
| <p>
Point.Largeur : <span id="repereLpos"></span><br>
Point.Hauteur : <span id="repereHpos"></span><br>
</p> |
J'aimerais reporter repereLpos & repereHpos dans la page html qui affiche le marqueur sous cette forme :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| <!-- MARQUEUR POSITION -->
<ul data-markers="">
<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= <-- ici repereLpos -->
data-marker-top= <-- ici repereHpos -->
data-marker-width=28
data-marker-height=36
data-show-after-zoom-factor=0>
<div class="InfoDiv">Vous etes ici</div>
</li>
</ul> |
Je vois pas comment inserer / appeler du javascript dans la partie html.
La balise <li> n'accepte pas d'autre balise (<script type="text/javascript"> ...... / data-marker-left id="reperePos) "
Avez vous une solution ?
Merci d'avance
