Google Maps trucs & astuces : zoom après fitbounds
par
, 27/02/2016 à 10h20 (2337 Affichages)
Bonjour à tous,
L'utilisation de la méthode fitbounds(bounds) modifiait la valeur du zoom définit dans les options initiales passées en paramètre lors de la construction de la carte Google Maps (fonction initMaps).
J'ai recoupé les différentes solutions proposée sur les forums et j'ai remarqué qu'une des solutions était récurrente , l'ajout de la ligne de code ci-dessous avant (voire après mais pas testé?) l'appel à la méthode fitBounds et ça marche pour moi, moi, moi...Merci Plastic .
Code JAVASCRIPT : Sélectionner tout - Visualiser dans une fenêtre à part google.maps.event.addListenerOnce(VotreInstanceGMaps, 'bounds_changed', function(event) {if (this.getZoom() > oMap.zoom) { this.setZoom(valeur zoom); } });
La méthode in situ...oui enfin dans mon code :
Code JAVASCRIPT : 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 function initMaps(contenerGMaps) { var ajaxXHR = ajaxOutput("setRating"); ajaxXHR.success(function (oDataSQL) { if (document.getElementById) { var oMap = { map: null, markers: [], lat: null, lng: null, latLng:null, title: null, zoom: 15 }; var mapDiv = document.getElementById(contenerGMaps); oMap.lat = parseFloat(oDataSQL[0]["LATITUDE"]); oMap.lng = parseFloat(oDataSQL[0]["LONGITUDE"]); oMap.title = oDataSQL[0]["NAME"]; oMap.latLng = new google.maps.LatLng(oMap.lat,oMap.lng); var options = { center: oMap.latLng , zoom:oMap.zoom, maxZoom : 20, mapTypeId: google.maps.MapTypeId.ROADMAP, streetViewControl: true, scalecontrol: true, mapTypeControl:true, navigationControl:true }; }; oMap.map = new google.maps.Map(mapDiv, options); addMarker(oMap); adjustViewPort(oMap); }); }
Je vous fais grâce du code de addMarker(oMap) car sans intérêt et passe directement à adjustViewPort(oMap);
Code JAVASCRIPT : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 function adjustViewPort (oMap) { if (oMap.map) { var bounds = new google.maps.LatLngBounds(); for (var i in oMap.markers) {bounds.extend(oMap.markers[i].getPosition());} /* La solution */ google.maps.event.addListenerOnce(oMap.map, 'bounds_changed', function(event) {if (this.getZoom() > oMap.zoom) { this.setZoom(oMap.zoom); } }); oMap.map.fitBounds(bounds); } };
Mes sources:
DANIEL
Nequin
Merci à eux et la toute la communauté
Be seeing you