Marker sur weatherMap

**loribac** · 28/12/2013, 15h46

bonjour
j 'essais de placer un marker sur une carte weathermap mais cela ne donne rien. Pouvez vous me dire ou j 'ai commis une erreur dans le code suivant merci à vous

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
 
 
		<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=weather"></script>
		<script type="text/javascript">
			function initialisation(){
				var centreCarte = new google.maps.LatLng(<?php echo "$cor1,$cor2";?>);
				var optionsCarte = {
					zoom: 9,
					center: centreCarte,
 
 
 
 
					mapTypeId: google.maps.MapTypeId.ROADMAP
				}
 
 
 
 
    var marqueur = new google.maps.Marker({
        position: new google.maps.LatLng(<?php echo "$cor1,$cor2";?>),
        map: centreCarte
    });
 
 
				var maCarte = new google.maps.Map(document.getElementById("EmplacementDeMaCarte"), optionsCarte);
				var coucheMeteo = new google.maps.weather.WeatherLayer();
				coucheMeteo.setMap(maCarte);
 
 
 
 
			 }
 
 
			 google.maps.event.addDomListener(window, 'load', initialisation);
		</script>
	</head>
 
	<body>
		<div id="EmplacementDeMaCarte"></div>
		<noscript>
			<p>Attention : </p>
			<p>Afin de pouvoir utiliser Google Maps, JavaScript doit ?tre activ?.</p>
			<p>Or, il semble que JavaScript est d?sactiv? ou qu'il ne soit pas support? par votre navigateur.</p>
			<p>Pour afficher Google Maps, activez JavaScript en modifiant les options de votre navigateur, puis essayez ? nouveau.</p>
		</noscript>
	</body>
</html>

**NoSmoking** · 28/12/2013, 16h04

Bonjour,

Pouvez vous me dire ou j 'ai commis une erreur...

en ne prenant pas le temps de relire ce que tu écris

Code :

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

1
2
3
4
var marqueur = new google.maps.Marker({
    position: new google.maps.LatLng(<?php echo "$cor1,$cor2";?>),
    map: centreCarte    // CA c'est n'importe quoi!!
});

Comment créer un marker ?

**loribac** · 31/12/2013, 02h22

Bonjour noSmoking,

Si je me réfère a la faq je devrais employer ceci

Code :

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

1
2
3
4
5
6
 
 
var oMarker = new google.maps.Marker({
    'position' : new google.maps.LatLng( latitude, longitude),// position d'ancrage du marker sur la carte
    'map' : oMap                                              // l'objet carte sur lequel est affiché le marker
  });

**NoSmoking** · 31/12/2013, 08h19

Si je me réfère a la faq je devrais employer ceci

est ce que tu as au moins essayé ?

**loribac** · 01/01/2014, 19h56

Oui biensure, Merci

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
 
 
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=weather"></script>
		<script type="text/javascript">
			function initialisation(){
				var centreCarte = new google.maps.LatLng(<?php echo "$cor1,$cor2";?>);
				var optionsCarte = {
					zoom: 9,
					center: centreCarte,
					mapTypeId: google.maps.MapTypeId.ROADMAP
 
}
 
 
 
				var maCarte = new google.maps.Map(document.getElementById("EmplacementDeMaCarte"), optionsCarte);
				var coucheMeteo = new google.maps.weather.WeatherLayer();
				coucheMeteo.setMap(maCarte);
 
 
				var optionsMarqueur = {
					position: maCarte.getCenter(),
					map: maCarte
				};
				var marqueur = new google.maps.Marker(optionsMarqueur);
 
 
			 }
 
 
			 google.maps.event.addDomListener(window, 'load', initialisation);
		</script>

**loribac** · 07/01/2014, 21h57

Bonjour,

Pour compléter ma carte je souhaiteras ajouter la couche météo googleWeather je n 'arrive qu a afficher la carte sans information

Voici le code tel quel avec forcement une erreur je ne trouve pas dans mes recherche sur le web de solution ou d'exemple par contre j'arrive bien a afficher sur une autre carte google la meteo et le trafic donc la je suis limité :=)

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
 function initCarte() {
     var i, nb = data.length;
     var monIconPerso = new google.maps.MarkerImage("http://www.xxxxxxx.fr/img/sc.gif",
         /* dimensions de l'image */
         new google.maps.Size(30, 30),
         /* Origine de l'image 0,0. */
         new google.maps.Point(0, 0),
         /* l'ancre (point d'accrochage sur la map) du picto
  (varie en fonction de ces dimensions) */
         new google.maps.Point(0, 0)
     );
     var oMap = new google.maps.Map(document.getElementById('div_carte'), {
         'center': new google.maps.LatLng(47, 4),
         'zoom': 5,
         'minZoom': 5,
         'maxZoom': 7,
         'backgroundColor': '#fff',
         'mapTypeId': google.maps.MapTypeId.HYBRID
     });
     var coucheMeteo = new google.maps.weather.WeatherLayer();
     coucheMeteo.setMap(oMap);
     Marker = new google.maps.Marker({
         'map': oMap,
         'position': oMap.getCenter(),
         title: "Centre Carte"
     });
     for (i = 0; i < nb; i++) {
         oMarker = new google.maps.Marker({
             'optimized': false,
             'map': oMap,
             icon: monIconPerso,
             'position': new google.maps.LatLng(data[i][0], data[i][1])
         });
     }
 }
 // init lorsque la page est chargée
 google.maps.event.addDomListener(window, 'load', initCarte);
</script>
</head >
<body>
<div id = "div_carte"> </div>
</body>
</html>

**NoSmoking** · 08/01/2014, 18h55

Un premier conseil avant de poster ton code fait un effort de présentation si tu veux que l'on te lise.

Online JavaScript beautifier

Deuxième conseil, cherche ce qui ne te sert à rien dans ton code ou qui n'est pas défini.

**loribac** · 11/01/2014, 18h13

Bonjour,

Donc voici la partie du code qui ne fonctionne pas.C'est la partie
var coucheMeteo qui ne fonctionne pas mais la je ne comprends pas pourquoi et je ne trouve pas d'exemple

Code html :

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

1
2
3
4
5
6
7
8
<!-- Un élément HTML pour recueillir l’affichage -->
<div id="maposition"></div>
 
<!-- Un élément HTML pour recueillir la carte -->
<div id="map" style="width:400px;height:500px"></div>
 
<!-- Chargement de l'API Google maps -->
<script src="http://maps.google.com/maps/api/js?sensor=false"></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
// Position par défaut
var centerpos = new google.maps.LatLng(48.579400,7.7519);
 
// Ansi que des options pour la carte, centrée sur latlng
var optionsGmaps = {
	center:centerpos,
	navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
	mapTypeId: google.maps.MapTypeId.ROADMAP,
	zoom: 7
};
 
// Initialisation de la carte avec les options
var map = new google.maps.Map(document.getElementById("map"), optionsGmaps);
 
 
// Rajout des informations météo sur la carte
var coucheMeteo = new google.maps.weather.WeatherLayer();
				coucheMeteo.setMap(map);

**NoSmoking** · 11/01/2014, 22h44

Un deuxième conseil avant de poster ton code fait un effort de présentation si tu veux que l'on te lise.

Online JavaScript beautifier

je ne comprends pas pourquoi et je ne trouve pas d'exemple

il faut déjà comprendre ce que l'on écrit surtout lorsque l'on change de code en cours de route , ce qui ne semble pas être ton cas, concernant les exemples le plus simple et de se référer à la documentation officielle de l'API.

Bonne recherche.

**loribac** · 12/01/2014, 00h20

Oui Monsieur !

**loribac** · 12/01/2014, 23h27

je plaisante Vais je avoir encore une remontée de bretelle de papa smoky je ne sais pas mais je me risque..... je plaisante Nosmoking je plaisante....

voici le code complet qui fonctione parfaitement sauf si je rajoute la couche méteo ..... mais pourquoi donc?

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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
 
<!doctype html>
<html lang="fr">
<head>
<title>HTML5 : Géolocalisation avec carte Google Maps</title>
<meta name="viewport" content="user-scalable=no,width=device-width">
 
<meta charset="utf-8">
</head>
<body>
 
<!-- Un élément HTML pour recueillir l’affichage -->
<div id="maposition"></div>
 
<!-- Un élément HTML pour recueillir la carte -->
<div id="map" style="width:400px;height:500px"></div>
 
<!-- Chargement de l'API Google maps -->
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
 
<script>
 
// Position par défaut
var centerpos = new google.maps.LatLng(48.579400,7.7519);
 
// Ansi que des options pour la carte, centrée sur latlng
var optionsGmaps = {
	center:centerpos,
	navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
	mapTypeId: google.maps.MapTypeId.ROADMAP,
	zoom: 7
 
 
 
 
 
 
 
};
 
// Initialisation de la carte avec les options
var map = new google.maps.Map(document.getElementById("map"), optionsGmaps);
 
 
 
 
 
 
 
 
 
 
var coucheMeteo = new google.maps.weather.WeatherLayer(); //  ya n'avoir probleme ici
coucheMeteo.setMap(map);
 
 
 
var coucheMeteo = new google.maps.TrafficLayer();
  coucheMeteo.setMap(map);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
if(navigator.geolocation) {
 
	// Fonction de callback en cas de succès
	function affichePosition(position) {
 
 
 
 
 
 
 
//window.location.href = "main.php?latitude=" + position.coords.latitude + "&longitude=" + position.coords.longitude + "&speed=" + position.coords.speed + "&altitude=" + position.coords.altitude;
 
 
 
		var infopos = "meteo";
		//infopos += "Latitude : "+position.coords.latitude +"<br>";
		//infopos += "Longitude: "+position.coords.longitude+"<br>";
		//infopos += "Altitude : "+position.coords.altitude +"<br>";
                                    //infopos += "Speed : "+position.coords.speed +"<br>";
 
		document.getElementById("maposition").innerHTML = infopos;
 
 
 
 
 
		// On instancie un nouvel objet LatLng pour Google Maps
		var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
 
 
 
 
 
 
 
 
 
 
 
 
 
		// Ajout d'un marqueur à la position trouvée
		var marker = new google.maps.Marker({
			position: latlng,
			map: map,
			title:"Vous êtes ici"
		});
 
		map.panTo(latlng);
 
 
 
 
 
 
 
	}
 
	// Fonction de callback en cas d’erreur
	function erreurPosition(error) {
		var info = "Erreur lors de la géolocalisation : ";
		switch(error.code) {
		case error.TIMEOUT:
			info += "Timeout !";
		break;
		case error.PERMISSION_DENIED:
			info += "Vous n’avez pas donné la permission";
		break;
		case error.POSITION_UNAVAILABLE:
			info += "La position n’a pu être déterminée";
		break;
		case error.UNKNOWN_ERROR:
			info += "Erreur inconnue";
		break;
		}
		document.getElementById("maposition").innerHTML = info;
	}
 
	navigator.geolocation.getCurrentPosition(affichePosition,erreurPosition);
 
} else {
 
	alert("Ce navigateur ne supporte pas la géolocalisation");
 
}
 
</script>
 
 
 
</body>
</html>

**loribac** · 19/01/2014, 17h21

J 'ai trouvé c'était un problème de librairie google

Marker sur weatherMap

APIs Google

Discussions similaires

Partager

Partager