Discussion :

[lokomass]

Bonjour à tous,

J'utilise la libraire gmaps.js pour afficher mes maps. Ça fonctionne plutôt pas mal.
Cela dit j'ai un petit souci, j'ai réussi à ajouter mes markers grâce à NoSmoking, mais maintenant j'aimerai adapter le zoom à celle-ci. C'est à dire que tous mes markers soient dans le champ de vision de la carte. Ça ne fonctionne pas avec mes 14 adresses, ça zoom sur l'océan pacifique quelque part, je ne comprend pas pourquoi. Du coup j'ai essayé un fiddle avec d'autres adresses, mais j'ai la même chose... Je ne comprend pas, même avec une autre méthode telle que fitLatLngBounds, j'ai le même résultat....
Voici mon fiddle merci pour votre aide,

https://jsfiddle.net/go310gy1/1/

[NoSmoking]

Bonjour,
si je reprends ton bout de code

Code :

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

1
2
3
4
5
  	map.setCenter(latitude, longitude);
  	for (i=0;i<adresses.length;i++) {
  		markers(i);
  	}
  	map.fitZoom();

ta fonction markers, entre nous pas un nom forcément judicieux, fait un appel asynchrone vai un pour la gétn, donc tu ne sais pas quand les « markers » seront ajoutés, par contre le bout de code map.fitZoom() sera immédiatement exécuté en fin de boucle, à ce moment il n'y aura donc vraisemblablement rien à fitZommer.

Si tu veux que cela fonctionne il te faut mettre la méthode sur le success de ton GeoCodeur, soit d'après ton code

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
  function markers(i) {
     GMaps.geocode({
        address: adresses[i],
        callback: function(results, status) {
          if (status == 'OK') {
            var result = results[0].geometry.location;
            var latitude = result.lat();
            var longitude = result.lng();
            map.addMarker({
              lat: latitude,
              lng: longitude
            });
            map.fitZoom(); // <= ICI 
          }
        }
      });
  }

[lokomass]

Ca fonctionne impecc merci

[lokomass]

Bonjour,

Une dernière question, j'ajoute mon marker de cette manière :

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
 
var image = {
	url: '../images/maps.jpg',
	scaledSize: new google.maps.Size(30, 30),
	size: new google.maps.Size(30, 30),
	origin: new google.maps.Point(0, 0),
	anchor: new google.maps.Point(0, 30)
};
map.addMarker({
	lat: latitudes[i],
	lng: longitudes[i],
	icon: image,
	infoWindow: {
		content: '<p>'+timestamps[i]+'</p>'
	}
});

Est-il possible d'ajouter une partie de css sur l'image en question ? Et plus précisemment, un border-radius sur l'image '../images/maps.jpg' ?

Merci pour ton aide,

[NoSmoking]

Est-il possible d'ajouter une partie de css sur l'image en question ?

pourquoi ne pas faire cela à la source, cette solution sera bien plus pérenne.

[lokomass]

Parce qu'en réalité dans une autre carte j'utilise une icône pour chaque utilisateur soit 25-30 personnes. Le souci du coup c'est que ce sont leurs avatars sur le site. Ét modifier chaque Avatar est assez gênant surtout qu'ils peuvent le changer quand ils veulent.

[NoSmoking]

Il aurait mieux valu ouvrir une autre discussion car le sujet est très différent.

Je trouve ton approche bizarre, pourquoi ne pas faire plutôt quelque chose comme la Carte des membres sur DVP.

Les markers personnalisés sont limités, tu pourrais néanmoins passer par des overlays customisés.