Lien dans infobulle?

**ifsera** · 22/02/2009, 15h13

Salut,
Je galères depuis un moment, alors si quelqu'un a la solution, je prends.

J'essaie d'insérer un lien dans mes infobulles. Ces liens me permettront ensuite de remplir deux zones de texte à partir du contenu de mon infobulle.

Mais bon, je bloque déjà sur l'étape une...

Voilà le code, si quelqu'un a déjà fait, ou voit..

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
 
  <head>
 
    <script src="http://maps.google.com/maps?file=api&v=1
 
            &key=cléApi" type="text/javascript">
 
    </script>
 
 
  </head> 
  <title>Carte</title>
 
  <body>
 
    <div id="map" style="width: 511px; height: 394px"></div>
 
     <div id="message" class="texte" align="center"></div> 
 
     <script type="text/javascript">
    //<![CDATA[
 
    //Creation de la fonction createInfoMarker
 
    function createInfoMarker(point, address) 
    {
      var marker = new GMarker(point);
      GEvent.addListener( marker , 
                          "click" ,
                          function(){marker.openInfoWindowHtml(address);}
                        );
      return marker;
    }
 
 
    function Positionner(Long, Lat)
    {
          map.setCenter(new GLatLng(Lat, Long), 17); 
    }
 
    // Création de la carte dans le DIV 'map'
    var map = new GMap2(document.getElementById("map"));
 
    // Paramétrage de la carte
    map.setCenter(new GLatLng(48.855679899768994, 2.352447509765625), 11); // Positionnement
    map.addControl(new GLargeMapControl());       // Outils déplacement et zoom
    map.addControl(new GScaleControl()) ;         // Affichage échelle
    map.addControl(new GMapTypeControl());        // Choix type de carte
   // map.addControl(new GOverviewMapControl());    // Mini carte de navigation
    map.enableDoubleClickZoom();                  // Zoom par double-click
 
    // Ajout des points
    // -----------------    
 
    var point = new GPoint(2.2614455223083496, 48.839257686789665);
    address = "<b>Nom</b><br />97, avenue de ...<br />codePostal Ville";
    var marker = createInfoMarker(point, address);
    map.addOverlay(marker);
 
	//]]>
    </script>
 
</body>
 
</html>

Merci

**goldou321** · 22/02/2009, 17h13

Il suffit de placer le lien dans la variable address :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

address = "<b>Nom</b><br />97, avenue de ...<br />codePostal <br /><br/>Ville<br/><br/><a href='http://www.developpez.net'>Mon Lien</a>";

**ifsera** · 22/02/2009, 17h43

Merci goldou321,
J'avais tenté un peu plus tôt, mais j'avais foiré un truc dans la syntaxe.

J'avais ajouté des "" ou des '' de trop. Enfin bon, passons..

**goldou321** · 22/02/2009, 17h55

hehe, de rien

méprendre des ' pour des "… un grand classique

Bon courage

**ifsera** · 23/02/2009, 12h24

Je suis à l'étape n°2, et j'ai un nouveau souci.
Voilà, je veux remplir ma zone de texte sur le clic de mon lien.
J'arrive à le faire en dehors de l'infobulle. Mais dès que je passes le lien dans l'infobulle, via "address", son événement foire.
Erreur de syntaxe?

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
 
  <head>
 
    <script src="http://maps.google.com/maps?file=api&v=1
 
            &key=CléApi" type="text/javascript">
 
    </script>
 
 
  </head> <title>Carte</title>
 
  <body>
 
    <div id="map" style="width: 511px; height: 394px"></div>
 
     <script type="text/javascript">
    //<![CDATA[
 
//fonction qui va me remplir la zone de texte
function add(text) {
document.getElementById("intext").value += text; // ajouter à la suite de l'existant
}
    //Creation de la fonction createInfoMarker
 
    function createInfoMarker(point, address) 
    {
      var marker = new GMarker(point);
      GEvent.addListener( marker , 
                          "click" ,
                          function(){marker.openInfoWindowHtml(address);}
                        );
      return marker;
    }
 
    function Positionner(Long, Lat)
    {
          map.setCenter(new GLatLng(Lat, Long), 17); 
    }
 
    // Création de la carte dans le DIV 'map'
    var map = new GMap2(document.getElementById("map"));
 
    // Paramétrage de la carte
    map.setCenter(new GLatLng(48.855679899768994, 2.352447509765625), 11); // Positionnement
    map.addControl(new GLargeMapControl());       // Outils déplacement et zoom
    map.addControl(new GScaleControl()) ;         // Affichage échelle
    map.addControl(new GMapTypeControl());        // Choix type de carte
   // map.addControl(new GOverviewMapControl());    // Mini carte de navigation
    map.enableDoubleClickZoom();                  // Zoom par double-click
 
    // Ajout des points
    // -----------------    
 
   // (3,'pil','33, rue de l'Allié',75009,'PARIS')
	var point = new GPoint(2.3192954063415527, 48.83769002291901);
    address = "<b>pil</b><br />33, rue du Nord<br />75014 PARIS<br/><a href='#' onClick='javascript:add('pil')' />lien2</a>";
    //<a href='#' onClick="javascript:add('pil')"/><image src='drte.gif' alt='Départ' width='50' height='20' /></a><a href='#'><image src='gche.gif' alt='Retour' width='50' height='20' /></a>";
    var marker = createInfoMarker(point, address);
    map.addOverlay(marker);   
 
 
	//]]>
    </script>
 
<a href=# onClick="javascript:add('pil')" />lien1</a> 
 
<form>
<input type="text" id="intext" name="intext" value="" />
</form>
 
 
  </body>
 
</html>

Si quelqu'un voit, merci...

p.s. Mon champ se remplit indéfiniment. Le texte se concatène sur le clic, or je voudrais qu'il soit remplit qu'une fois. Qu'il y ait comme un clear au prochain clic.

**RomainVALERI** · 23/02/2009, 14h47

enlève juste un "+" ici ^^

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
function add(text) {
   document.getElementById("intext").value = text;
}

(mais à la rigueur on pourrait trouver que cette fonction ne porte plus très bien son nom et la renommer update ou remplir ou ce que tu veux)
(et attention aussi : si cette fonction est utilisée ailleurs et doit rester telle quelle : en écrire deux, ou une seule avec paramètre, enfin bref attention, quoi...)

Lien dans infobulle?

JavaScript

Vue hybride

Discussions similaires

Partager

Partager