Google지도 v3 특정 위치 확대/축소

Question

저는 아직 자바 스크립트를 많이 익히지 않았으며 이것은 제 1 번째 게시물입니다.

function initialize() { 

    // Create the map 
    // No need to specify zoom and center as we fit the map further down. 
    var map = new google.maps.Map(document.getElementById("map_canvas"), { 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     streetViewControl: false, 

    }); 

    // Create the shared infowindow with two DIV placeholders 
    // One for a text string, the other for the StreetView panorama. 
    var content = document.createElement("DIV"); 
    var title = document.createElement("DIV"); 
    content.appendChild(title); 
    var streetview = document.createElement("DIV"); 
    streetview.style.width = "200px"; 
    streetview.style.height = "200px"; 
    content.appendChild(streetview); 
    var infowindow = new google.maps.InfoWindow({ 
     content: content 
    }); 


    var markers = [{ 
     lat: 35.15074, 
     lng: -89.955992, 
     name: "Bob 1" 
    }, { 
     lat: 35.149425, 
     lng: -89.946595, 
     name: "Bob 2" 
    }, { 
     lat: 35.146687, 
     lng: -89.929837, 
     name: "Bob 3" 
    }, { 
     lat: 35.132264, 
     lng: -89.937197, 
     name: "Bob 4" 
    }]; 

    // Create the markers 
    for (index in markers) addMarker(markers[index]); 

    function addMarker(data) { 
     var marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(data.lat, data.lng), 
      map: map, 
      title: data.name 
     }); 

     google.maps.event.addListener(marker, "click", function() { 
      openInfoWindow(marker); 
     }); 
    } 

    // Zoom and center the map to fit the markers 
    // This logic could be conbined with the marker creation. 
    // Just keeping it separate for code clarity. 
    var bounds = new google.maps.LatLngBounds(); 
    for (index in markers) { 
     var data = markers[index]; 
     bounds.extend(new google.maps.LatLng(data.lat, data.lng)); 
    } 
    map.fitBounds(bounds); 

    // Handle the DOM ready event to create the StreetView panorama 
    // as it can only be created once the DIV inside the infowindow is loaded in the DOM. 
    var panorama = null; 
    var pin = new google.maps.MVCObject(); 
    google.maps.event.addListenerOnce(infowindow, "domready", function() { 
     panorama = new google.maps.StreetViewPanorama(streetview, { 
      navigationControl: false, 
      enableCloseButton: false, 
      addressControl: false, 
      linksControl: false, 
      visible: true 
     }); 
     panorama.bindTo("position", pin); 
    }); 

    // Set the infowindow content and display it on marker click. 
    // Use a 'pin' MVCObject as the order of the domready and marker click events is not garanteed. 
    function openInfoWindow(marker) { 
     title.innerHTML = marker.getTitle(); 
     pin.set("position", marker.getPosition()); 
     infowindow.open(map, marker); 
    } 
} 

자바 스크립트 내가 4 개 개의 다른 장소를했다, 그럼 내가 4 개 웹 페이지가 나는 특정 위치를 확대하려는 브라우저를 말하는 방법, 추가해야합니다. "Bob 1"을 확대하고 싶다고합시다. 그런 다음 웹 페이지의 이름을 bob1.html로 변경합니다. 내가 bob1.html을 클릭 할 때마다 웹 페이지는 zoom: 15 확대되고 마커는지도의 중심에 위치합니다.

Answer 1

이것이 사양의 일부가 아닌 한 4 개의 다른 페이지가 필요하지 않습니까?

map.setCenter(yourLatLngOrMarkerPosition); 

그리고 줌 레벨을 설정 :

위치와지도의 줌 레벨을 설정하려면 단순히 전화

map.setZoom(yourZoomLevel); 

이는의 인스턴스 후 어느 시점에 설정 될 수있다 버튼 클릭이나 시간이 지나면지도가 표시됩니까?

희망이 도움이됩니다.

편집 귀하의 요구 사항 (의견에 언급 된)을 고려하여 링크를 클릭 할 때 관련 URL 게시 매개 변수를 제출합니다. 각지도 페이지의 initialize 함수 내에서 Here과 비슷한 것을 사용하여 이것을 읽어야합니다. (이것은 jQuery를 사용하지만) 적절하게지도 옵션을 설정하십시오.

편집 URL 포스트 매개 변수를 PHP로 읽은 다음 Google지도 호출의 적절한 위치에 반향시킬 수 있습니다. 예를 들어

:

map.setZoom(<?php echo $_GET['urlZoomParam'];?>); 

등

일부 일반 PHP/MYSQL/Google지도는 문서를 스택 : 내가 뭘 의미하는 것은 큰소리로 말하다 [도트] co.kr에서 웹 사이트마다 비슷 https://developers.google.com/maps/articles/phpsqlajax_v3https://developers.google.com/maps/articles/phpsqlsearch_v3http://theoryapp.com/online-store-locator-using-php-mysql-and-google-maps/