Discussion :

[voyageurdumonde]

Bonjour,

Je cherche comment faire pour afficher et masquer des icones sur une carte google map en V3.



J'ai un fichier KML

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
 
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
<Document>
	<Placemark>
			<name>Independence Park </name>
			<numidaffich>coucou</numidaffich>
			<description>
 
				<![CDATA[<img src="thumb.php.png"><br /> URL = <a href="http://www.bountifulbaskets.org/?page_id=6&details=AASIBYTNIA0005G&state=NV&city=Boulder City"
					target=new">Location Details</a><br /> 
				Address = 1001 Legacy Dr.<br />
				City = Boulder City<br />
				State = NV<br />
				Week = A and B<br />
				TimePickup = 7:00 AM<br />
				TimeVolunteer = 5:00 AM<br />]]>
			</description>
			<Style>
			<IconStyle>
					<Icon>
						<href>http://www.xx/newpage/iconmarker_resto.png</href>
					</Icon>
			</IconStyle>
			</Style>
			<Point>
				<coordinates>-114.846404,35.96101699999998,0</coordinates>
			</Point>
		</Placemark>
		<Placemark>
			<name>Sunny Springs Park</name>
			<numidaffich>coucou1</numidaffich>
 
			<description>
				<![CDATA[URL = <a href="http://www1.bountifulbaskets.org/?page_id=6&details=AASIBYTNIA0005E&state=NV&city=Las Vegas"
					target=new">Location Details</a><br />
				Address = 7620 Golden Talon Ave<br />
				City = Las Vegas<br />
				State = NV<br />
				Week = A and B<br />
				TimePickup = 10:00 AM<br />
				TimeVolunteer = 9:00 AM<br />
				]]>
			</description>
			<Style>
			<IconStyle>
					<Icon>
						<href>http://www.bxx.com/newpage/iconmarker_avoir.png</href>
					</Icon>
			</IconStyle>
			</Style>
			<Point>
				<coordinates>-115.260471,36.29396299999998,0</coordinates>
			</Point>
		</Placemark>
 
 
</Document>
</kml>

Et j'ai la fonction suivante que masque toutes les icones

Code :

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

1
2
3
4
5
function hide_markers_kml(){
 
            geoXml.hideDocument();  
 
   }

et le code suivant :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
  var hideDocument = function (doc) {
    if (!doc) doc = docs[0];
    // Hide the map objects associated with a document 
    var i;
    if (!!doc.markers) {
      for (i = 0; i < doc.markers.length; i++) {
        if(!!doc.markers[i].infoWindow) doc.markers[i].infoWindow.close();
        doc.markers[i].setVisible(false);
      }
    }
}

Comment faire pour que seul le type d'icone <IconStyle> avec l'image iconmarker_resto.png soit masquer lorsque j'execute la fonction?

Merci de votre aide

[NoSmoking]

Bonsoir,
qu'est ce qui t'empêches de tester l'url de la propriété icon du marqueur.

Code :

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

1
2
3
if( doc.markers[i].icon == 'ref_icone_recherchee'){
  // faire ce qu'il y a à faire
}

ou avec l'utilisation de la méthode getIcon().

[voyageurdumonde]

Bonjour,

Merci pour ta reponse, j'ai fais quelque chose comme ci dessous mais cela ne fonctionne pas :

Code :

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

1
2
3
4
5
6
7
8
9
if (!!doc.markers) {
      for (i = 0; i < doc.markers.length; i++) {
 
        if(doc.markers[i].icon == 'iconmarker_resto.png'){
 
        doc.markers[i].setVisible(false);
        }
      }
    }

A quoi correspond 'ref_icone_recherchee' ?

Merci pour votre aide

[NoSmoking]

A quoi correspond 'ref_icone_recherchee' ?

je concéde que ma réponse a été un peu rapide, reprenons donc.

Lors de la lecture du fichier KML, à chaque marker, de type google.maps.MarkerOptions, il est associé une icon de type google.maps.MarkerImage.

Dans la structure de l'icon, il est une propriété intérressant pour toi, l'url.

Dans ta boucle de masquage des markers il te suffit de vérifier que l'url de l'icon des markers est égale à, ou contient, ce que tu veux masquer.

Code :

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

1
2
3
4
5
6
for( var i = 0; i < doc[0].markers.length; i++){
  if( doc[0].markers[i].icon &&
      doc[0].markers[i].icon.url.indexOf('iconmarker_resto') > -1){  // l'url correspond au restaurant
    doc[0].markers[i].setVisible(false);
  }
}

[voyageurdumonde]

Bonjour NoSmoking et merci pour ces explications. Maintenant ca fonctionne tres bien