Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Google Maps APIv3 - Zoom mapy
Forum PHP.pl > Forum > Po stronie przeglądarki
mihow
Witajcie!

Od wczoraj walczę z Google Maps APIv3.
Mam ileś tam punktów na mapie, ale chciałbym, aby mapa automatycznie dostosowywała zoom do punktów, które są na mapie.

Obecnie mam taki oto kod:

  1. <script type="text/javascript">
  2. <!--
  3. var mapa; // obiekt globalny
  4.  
  5. function dodajMarker(opcjeMarkera)
  6. {
  7. opcjeMarkera.map = mapa;
  8. var marker = new google.maps.Marker(opcjeMarkera);
  9. }
  10.  
  11. function mapaStart()
  12. {
  13. var wspolrzedne = new google.maps.LatLng(51.75817169098314,19.45627212524414);
  14. var opcjeMapy = {
  15. zoom: 4,
  16. center: wspolrzedne,
  17. mapTypeId: google.maps.MapTypeId.ROADMAP
  18. };
  19. mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);
  20.  
  21. // wspólne cechy ikon
  22. var rozmiar = new google.maps.Size(12,20);
  23. var rozmiar_cien = new google.maps.Size(22,20);
  24. var punkt_startowy = new google.maps.Point(0,0);
  25. var punkt_zaczepienia = new google.maps.Point(16,16);
  26.  
  27. var ikona_35 = new google.maps.MarkerImage("http://labs.google.com/ridefinder/images/mm_20_yellow.png", rozmiar, punkt_startowy, punkt_zaczepienia);
  28. var ikona_36 = new google.maps.MarkerImage("http://labs.google.com/ridefinder/images/mm_20_blue.png", rozmiar, punkt_startowy, punkt_zaczepienia);
  29. var ikona_37 = new google.maps.MarkerImage("http://labs.google.com/ridefinder/images/mm_20_green.png", rozmiar, punkt_startowy, punkt_zaczepienia);
  30. var ikona_38 = new google.maps.MarkerImage("http://labs.google.com/ridefinder/images/mm_20_red.png", rozmiar, punkt_startowy, punkt_zaczepienia);
  31. var ikona_39 = new google.maps.MarkerImage("http://labs.google.com/ridefinder/images/mm_20_orange.png", rozmiar, punkt_startowy, punkt_zaczepienia);
  32. var ikona_40 = new google.maps.MarkerImage("http://labs.google.com/ridefinder/images/mm_20_purple.png", rozmiar, punkt_startowy, punkt_zaczepienia);
  33. var ikona_36 = new google.maps.MarkerImage("http://labs.google.com/ridefinder/images/mm_20_white.png", rozmiar, punkt_startowy, punkt_zaczepienia);
  34.  
  35. var cien = new google.maps.MarkerImage("http://labs.google.com/ridefinder/images/mm_20_shadow.png", rozmiar_cien, punkt_startowy, punkt_zaczepienia);
  36.  
  37.  
  38. dodajMarker({position: new google.maps.LatLng(54.3721279,18.6269876), title: 'Multikino Gdańsk - Kino 10-ekranowe', icon: ikona_37, shadow: cien, clickable: true});
  39.  
  40.  
  41. dodajMarker({position: new google.maps.LatLng(52.39990521956092,16.929244995117187), title: 'Multikino Poznań - Kino 8-ekranowe', icon: ikona_37, shadow: cien, clickable: true});
  42.  
  43.  
  44. dodajMarker({position: new google.maps.LatLng(52.1498963,21.046855), title: 'Multikino Ursynów - Kino 12-ekranowe', icon: ikona_37, shadow: cien, clickable: true});
  45.  
  46.  
  47. dodajMarker({position: new google.maps.LatLng(52.211104250993905,20.769996643066406), title: 'Wacker Maszyny Budowlane / Budynek biurowo-magazynowy', icon: ikona_37, shadow: cien, clickable: true});
  48.  
  49.  
  50. dodajMarker({position: new google.maps.LatLng(52.206864,20.954589), title: 'Ogrody Shiraz', icon: ikona_39, shadow: cien, clickable: true});
  51.  
  52.  
  53. dodajMarker({position: new google.maps.LatLng(55.745762657730495,37.778892517089844), title: 'Perovo Shopping Center', icon: ikona_35, shadow: cien, clickable: true});
  54.  
  55. }
  56. -->
  57. </script>


Chciałem zastosować takie rozwiązanie:

  1. var LatLngList = array (new google.maps.LatLng(53.4203,14.7011), new google.maps.LatLng(53.3902,14.7202), new google.maps.LatLng(53.4101,14.6033), new google.maps.LatLng(53.4014,14.5104));
  2. var bounds = new google.maps.LatLngBounds ();
  3. for (var i = 0, LtLgLen = LatLngList.length; i < LtLgLen; i++) {
  4. bounds.extend (LatLngList[i]);
  5. }
  6. map.fitBounds (bounds);


Ale mi nie działa.

Czy możecie jakoś wspomóc kolegę? smile.gif
thek
Problem więc musisz mieć w extend i tego co do tego przekazujesz. Sposób bowiem rozwiązania poprzez użycie LanLngBounds jest jak najbardziej prawidłowy. Albo więc problemem są dane wejściowe, albo nieprawidłowe extend lub nieprawidłowe miejsce użycia fitBounds. W wielu przykładach jest choćby fitBounds wewnątrz pętli rozszerzającej, choć wystarczyłoby na zewnątrz, ale a nuż coś zmienili i teraz trzeba fitować za każdym dodaniem markera. Przetestuj także czy length w pętli zwraca prawidłową długość.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.