Aller au menu - Aller au contenu

quelqu'un de douer avec google map API V3

probleme d'affichage

Pour accéder à cette section
Connectez-vous !
connexion_rpx

Résolu Le problème de ce sujet a été résolu

Page 1 
Auteur Message
1 visiteur sur ce sujet (1 Anonyme)
Page 1 
Hors ligne ricouane # Posté le 07/02/2012 à 23:38:24

Bonsoir, j'ai un probleme avec ma carte google API v3. J'ai fait une fonction qui va afficher les markeurs et leurs info bulles de mes utilisateurs en fonction des etats. Mais la apres des heures de test je comprend toujours pas pourquoi la carte ne veut pas s'afficher. Il s'affiche sans cette fonction, pour moi il devrait pas avoir de probleme de syntaxe mes de connaissances. Voici le code.
Merci.

Code : JavaScript
 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
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #myMap { height: 100% }
    </style>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyBVgAkecU2FnnH7OUn4Tx7TfH1yJliifN4&sensor=false">
    </script>
    <script type="text/javascript" charset="utf-8">
    google.load("maps", "2.x");
	</script>
    <script src="userstatelist.js" type="text/javascript"></script>
    <script src="jquery-gmap3-4.1/jquery/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script type="text/javascript">
	  
	  var userCountryList = [1641,348];	
	  var markers = new array() ;  
   function initialize() {

        var myOptions = {
          center: new google.maps.LatLng(46.578498,-90.0059731),
          zoom: 3,
          mapTypeId: google.maps.MapTypeId.TERRAIN,

        };
        var map = new google.maps.Map(document.getElementById("myMap"),myOptions);
		
		var title1 =  "users in Canada :  " + userCountryList[0];
		var title2 =  "users in USA :  " + userCountryList[1];
   		var infowindow = new google.maps.InfoWindow({content: title1});
		var infowindow1 = new google.maps.InfoWindow({content: title2}); 
		var canada   = new google.maps.LatLng(58.278498,-101.0059731);
		var usa = new google.maps.LatLng(40.078498,-103.5859731);
		
		var markerCA = new google.maps.Marker({
      					   position: canada, 
      					   map: map,					   
						   title: "users in Canada"
     					   });
		var markerUS = new google.maps.Marker({
      					   position: usa, 
      					   map: map,					   
						   title: "users in USA"
     					   });						   
     google.maps.event.addListener(markerCA, 'mouseover', function() {
      infowindow.open(map, markerCA);
    });
	 google.maps.event.addListener(markerUS, 'mouseover', function() {
      infowindow1.open(map, markerUS);
    });
	
	 google.maps.event.addListener(map, 'zoom_changed', function() {
		zoomLevel = map.getZoom();
		markerCA.setMap(null);
		markerUS.setMap(null);
		
		if(zoomLevel == 4){ 
		     showState();
		}
  				});//zoom_changed
				
	  function showState() {
		 for(var i = 0; i < 63; i++){
			 if(userStateList[i][1] != 0){
		   var title = 'users in' + userStateList[i][0] + ': ' + userStateList[i][1];	 
		   var pos = new google.maps.LatLng(userStateList[i][2],userStateList[i][3]);
		   var marker = new google.maps.Marker({
      					   position: pos, 
      					   map: map,					   
						   title: "users per states"
     					   });
		var infowindows = new google.maps.InfoWindow({content: title});				   
		var google.maps.event.addListener(marker, 'mouseover', function() {
      		infowindows.open(map, marker);
   						 });
			 }//if
			 
		   }//for		  		          		
	   }//showState				
				
				
					
}//initialize()
	 

	  
    </script>
  </head>
  <body onload="initialize()">
    <div id="myMap" style="width:100%; height:100%"></div>
  </body>
</html>
Publicité # Posté le 07/02/2012 à 23:38:24

Hors ligne Adonis # Posté le 08/02/2012 à 00:32:28

Avatar

Salut,

Tu as un problème de la ligne 76 à la ligne 78.
Donc ligne 76 variable mal déclarée.

Cordialement, Adonis ^^ .
Édité le 08/02/2012 à 00:34:55 par Adonis
 
Hors ligne ricouane # Posté le 08/02/2012 à 00:35:05

Merci beaucoup pour la reponse masi pourrais-tu etre un peu plus precis.

Merci.
Hors ligne Adonis # Posté le 08/02/2012 à 00:35:59

Avatar

Hors ligne ricouane # Posté le 08/02/2012 à 17:36:23

Ok merci, il fallaitenlever le var. Mantenant en faite la carte s'affiche bien mais les nouveaux marqeurs creer non. Un probleme entraine un autre.
Hors ligne Adonis # Posté le 08/02/2012 à 18:23:20

Avatar

Il serait bien que tu donnes un lien de test, pour voir les éventuelles erreurs.
Édité le 08/02/2012 à 18:23:34 par Adonis
 
Hors ligne ricouane # Posté le 08/02/2012 à 19:52:25

voici le lien mais j'ai retirer la fonction car j'essaye deja d'afficher un marqeur apres le zoom


http://www.qriket.com/newMap.php
Hors ligne Adonis # Posté le 08/02/2012 à 20:01:22

Avatar

Tu as deux marqueurs sur la carte là.
Tu souhaites quoi de plus ? Tu peux développer s'il te plaît.
 
Hors ligne ricouane # Posté le 08/02/2012 à 21:03:41

Salut merci, je viens de mettre a jours les changements. Quand tu fait un zoom il devrait avoir une cinquantaine de markers qui apparaient. Le truc c'est que je les ajoutes dans un array pour pouvoir les supprimer par la suite quand je ferais un zoom out. Le probleme je ne comprend par pourquoi le faite de les ajouter dans un array apres leur creation fait qu'il y a uniquement le dernier qui s'affiche.

Merci d'avance.

Stephane.

http://www.qriket.com/newMap.php
Hors ligne Adonis # Posté le 08/02/2012 à 21:50:36

Avatar

T'as une erreur sur le lien que tu m'as donné.
Tu as un array qui se nome markers.
Et dans ta boucle for tu fais makers.push t'as oublié le R je crois.
Mais bon j'ai essayé avec le R ca n'affiche pas les markers, mais c'est toujours une chose de corrigée.
 
Hors ligne ricouane # Posté le 08/02/2012 à 21:52:41

Donc tu ne vois pas d'ou viens le probleme ?
Hors ligne Adonis # Posté le 08/02/2012 à 21:53:41

Avatar

Corrige déjà l'erreur.
Chaque chose en son temps. Je suis entrain de regarder...

Voilà comme ca cela fonctionne voici le code.

Code : JavaScript
  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
var userStateList = [
['Alabama', 2, -87.5692, 33.2098], 
['Alaska', 1, -151.548, 59.6425], 
['Arizona', 0, 0, 0], 
['Arkansas', 4, -93.0326, 34.5319], 
['California', 32, -117.157, 32.7153], 
['Colorado', 5, -104.709, 40.4233], 
['Connecticut', 0, 0, 0], 
['Delaware', 2, -75.5244, 39.1582], 
['District Of Columbia', 0, 0, 0], 
['Florida', 8, -82.3879, 28.5553], 
['Georgia', 5, -84.388, 33.749], 
['Hawaii', 0, 0, 0], 
['Idaho', 1, -111.785, 43.8231], 
['Illinois', 7, -87.7387, 41.6689], 
['Indiana', 1, -86.9081, 40.4259], 
['Iowa', 3, -96.5567, 42.8253], 
['Kansas', 2, -95.4572, 37.6792], 
['Kentucky', 2, -85.7585, 38.2527], 
['Louisiana', 3, -92.4957, 30.3313], 
['Maine', 0, 0, 0], 
['Maryland', 2, -76.9067, 38.6344], 
['Massachusetts', 8, -71.302, 42.6704], 
['Michigan', 4, -84.4839, 42.737], 
['Minnesota', 2, -93.1139, 44.9542], 
['Mississippi', 4, -88.59, 30.9252], 
['Missouri', 2, -93.1969, 39.1231], 
['Montana', 0, 0, 0], 
['Nebraska', 1, -95.998, 41.2524], 
['Nevada', 0, 0, 0], 
['New Hampshire', 0, 0, 0], 
['New Jersey', 7, -74.9614, 39.8519], 
['New Mexico', 0, 0, 0], 
['New York', 103, -74.006, 40.7144], 
['North Carolina', 1, -77.4302, 34.7541], 
['North Dakota', 0, 0, 0], 
['Ohio', 12, -81.3911, 41.4299], 
['Oklahoma', 3, -97.4781, 35.6528], 
['Oregon', 1, -122.804, 45.4871], 
['Pennsylvania', 11, -75.8813, 41.2459], 
['Rhode Island', 0, 0, 0], 
['South Carolina', 0, 0, 0], 
['South Dakota', 0, 0, 0], 
['Tennessee', 2, -86.7844, 36.1659], 
['Texas', 10, -97.1081, 32.7357], 
['Utah', 3, -111.86, 40.5725], 
['Vermont', 0, 0, 0], 
['Virginia', 5, -77.4291, 39.0067], 
['Washington', 5, -122.332, 47.6062], 
['West Virginia', 0, 0, 0], 
['Wisconsin', 0, 0, 0], 
['Wyoming', 1, -108.757, 44.7538], 
['British Columbia', 30, -120.327, 50.6745], 
['Ontario', 1633, -79.2576, 43.773], 
['Newfoundland and Labrador', 3, -52.7128, 47.5605], 
['Nova Scotia', 3, -63.7593, 44.5287], 
['Prince Edward Island', 0, 0, 0], 
['New Brunswick', 1, -64.7782, 46.0878], 
['Quebec', 30, -71.2428, 46.8033], 
['Manitoba', 1, -97.1375, 49.8998], 
['Saskatchewan', 1, -104.607, 50.4547], 
['Alberta', 41, -113.583, 50.02], 
['Nunavut', 0, 0, 0], 
['Yukon Territory', 0, 0, 0]
];
var userCountryList = [1641,348];   
var map ;
   function initialize() {

        var myOptions = {
          center: new google.maps.LatLng(46.578498,-90.0059731),
          zoom: 3,
          mapTypeId: google.maps.MapTypeId.TERRAIN,

        };
        map = new google.maps.Map(document.getElementById("myMap"),myOptions);

        var canada   = new google.maps.LatLng(58.278498,-101.0059731);
        var usa = new google.maps.LatLng(40.078498,-103.5859731);
            
        var markerCA = new google.maps.Marker({
                           position: canada, 
                           map: map,                       
                           title: "users in Canada"
                           });
        var markerUS = new google.maps.Marker({
                           position: usa, 
                           map: map,                       
                           title: "users in USA"
                           });                         
     google.maps.event.addListener(markerCA, 'mouseover', function() {
      infowindow.open(map, markerCA);
    });
     google.maps.event.addListener(markerUS, 'mouseover', function() {
      infowindow1.open(map, markerUS);
    });


         for(var i = 0; i <61; i++)
         {
         if(userStateList[i][1] != 0)
         {
  
          var title = "users in " + userStateList[i][0] + " : " + userStateList[i][1];
          var pos = new google.maps.LatLng(userStateList[i][3], userStateList[i][2]);
          var marker = new google.maps.Marker({
                       position: pos, 
                       map: map,
                       title : title             
                           });
                                                 
         google.maps.event.addListener(marker, 'click', function() {
          infowindows.setContent(this.title);    
          infowindows.open(map, this);
                         });
                         
        
           }
        }
    
     google.maps.event.addListener(map, 'zoom_changed', function() {
        zoomLevel = map.getZoom();
        markerCA.setMap(null);
        markerUS.setMap(null);
 

        });                     
}
Édité le 08/02/2012 à 22:07:02 par Adonis
 
Hors ligne ricouane # Posté le 08/02/2012 à 22:17:30

Merci, mais en faite tu as fais le contraire c'est a dire afficher d'abord les etat apres le pays. Moi je veux en zoom 3 les markers des pays en 4 les etats. Apres pour repartir au zoom 3 il faut effacer les markers du zoom 4 le fait des les garder dans un tableau pour les effacer par la suite. J'ai remis a jours la carte tu peux voir ce que j'ai fait en parametre pour mieux comprendre.


http://www.qriket.com/newMap.php
Hors ligne Adonis # Posté le 08/02/2012 à 22:19:25

Avatar

J'ai rien compris, désolé.
Tu peux mieux expliquer s'il te plaît .. Car tu parles de plusieurs zooms mais je ne vois pas.
 
Hors ligne ricouane # Posté le 08/02/2012 à 22:30:15

zoom 3 affiche les users au canada et au etat unis.
zoom 4 affiche les users par etat => donc efface les marquers du zoom niveau 3
si nous somme en zoom 4 et on revien au zoom 3 il faut donc effacer les markers du zoom 4 pour afficher ceux du zoom 3 et ainsi de suite.

C'est plus clair ?

Retour au forum "Javascript" ou à la liste des forums

Pour accéder à cette section
Connectez-vous !
connexion_rpx