2012-12-01 118 views
0

我的谷歌地圖API地圖縮放顯示谷歌地方搜索後添加的所有標記。在移動地圖上,這可能需要一些時間來加載,因爲這個應用程序我喜歡只在視口中顯示結果。我讀到的大多數研究表明,僅在視口內返回結果是不可能的。添加標記之後,我能否保持地圖邊界不變?如果只顯示添加到當前界限的標記,除非只有一個標記返回,否則將會很好,那麼它應該放大該標記。因此,搜索比薩餅這樣的東西將在當前視口中顯示許多比薩餅位置而不進行平移或縮放。搜索特定地址將縮放到該標記,即使它位於視口之外。界限谷歌地圖

var input = document.getElementById('target'); 
var searchBox = new google.maps.places.SearchBox(input); 
var bounds = map.getBounds(); 
searchBox.setBounds(bounds); 
var markers = []; 
service = new google.maps.places.PlacesService(map); 

google.maps.event.addListener(searchBox, 'places_changed', function() { 
    var places = searchBox.getPlaces(); 
    // alert("getPlaces returns "+places.length+" places"); 

    for (var i = 0; i < gmarkers.length; i++) { 
     gmarkers[i].setMap(null); 
    } 

    gmarkers = []; 
    var bounds = new google.maps.LatLngBounds(); 

    for (var i = 0, place; place = places[i]; i++) { 
     var place = places[i]; 
     createMarker(place); 
     bounds.extend(place.geometry.location); 
    } 
    map.fitBounds(bounds); 
    // if (markers.length == 1) map.setZoom(17); 
    }); 

    google.maps.event.addListener(map, 'bounds_changed', function() { 
    var bounds = map.getBounds(); 
    searchBox.setBounds(bounds); 
    }); 

    ib = new InfoBox({}); 
+0

這聽起來很容易實現。你有什麼問題呢?您的代碼當前被編寫爲縮放以顯示所有返回的標記。 – geocodezip

+0

我的主要問題是這是我的第一個項目,我仍在學習。就代碼問題而言,我相信bounds.extend(place.geometry.location);正在使用我的空邊界變量,並給它一個經度和長度,將顯示所有的標記。然後map.fitBounds(邊界)實際上是使用該邊界來調整地圖大小以顯示所有標記。我嘗試過註釋map.fitBounds,它似乎使地圖不會移動,但並非總是如此。如果添加的標記超出了當前界限,if語句也只會放大。 – Rick

回答

1

的回答你的問題:

  • 它可能對我來說只保留地圖範圍從添加標記後改變?

是的。正如你所說,涉及到刪除map.fitBounds。

要使地圖居中並放大單個地址,請使用地理編碼器(單獨實施)或檢查結果數量(如果結果爲1),將結果放在結果中心,如果存在在結果中建議的視口,使用它來居中放大地圖[使用map.fitBounds(place.geometry.viewport)我認爲]。

+0

我試圖刪除map.fitBounds和更改視口如果marker.length == 1的功能。這適用於某些搜索,但地圖邊界仍然會改變一些時間。似乎Google搜索框API正在努力保留地圖視口。 – Rick

+0

你的代碼是居中和縮放地圖。發佈展示該問題的代碼(jsfiddle可能是最好的)。 – geocodezip