Google Maps API;禁止地圖平移以啓用頁面滾動

Question

我有一個移動網頁，客戶可以通過表單提交或當前位置彈出框輸入其郵政編碼，然後找到附近的中心。回覆包括這些中心的列表，以及谷歌地圖插入顯示其位置和引腳指示列表中指出的中心。

問題是地圖佔用了大量的頁面上的房地產。很難向下滾動到地圖下方的列表。

我想停用Google地圖上的平移功能，以便人們可以觸摸地圖並上下滾動頁面。但是，我不想完全禁止地圖上的所有觸摸事件，因爲我仍然希望人們能夠點擊引腳並查看與這些標記一起出現的彈出信息框。 Hense爲什麼我認爲靜態圖像實現可能不是最佳選擇。

下面是該頁面的鏈接：

http://cs.sandbox.millennialmedia.com/~tkirchner/sites/K/kumon/zip_page.php

我仍然相對較新的谷歌API，所以我敢肯定有一些選項或事件偵聽器，我需要定製，我可以」 t似乎還沒有在文檔中找到它。

任何幫助或鏈接，將不勝感激。

function setMap(map) { 
    if (typeof googleMap != 'undefined' && !changeFlag) return; 

    var current = new google.maps.LatLng(f.current.latitude, 
     f.current.longitude); 
    var dragFlag = false; 
    var start = 0, end = 0, windowPos = 0; 
    zoom = zoom == 0 ? bestZoom() : zoom; 
    map.html(''); 

    var mapArgs = { 
     zoom : zoom, 
     center : current, 
     mapTypeId : google.maps.MapTypeId.ROADMAP, 
     backgroundColor : '#FFFFFF', 
     mapTypeControl : false, 
    }; 
    if (!config.panning) mapArgs['draggable'] = false; 

    googleMap = new google.maps.Map(map.get(0), mapArgs); 
    new google.maps.Marker({ 
     position : current, 
     map : googleMap, 
     title : 'You Are Here', 
     icon : 'youarehere.png' 
    }); 

    movement = 0; 

    if (!config.panning && events == 'touch') { 
     map.get(0).addEventListener('touchstart', function(e){ 
      dragFlag = true; 
      start = events == 'touch' ? e.touches[0].pageY : e.clientY; 
     },true); 
     map.get(0).addEventListener('touchend', function(){ 
      dragFlag = false; 
     }, true); 
     map.get(0).addEventListener('touchmove',function(e){ 
      if (!dragFlag) return; 
      end = events == 'touch' ? e.touches[0].pageY : e.clientY; 
      window.scrollBy(0,(start - end)); 
     }, true); 
    } 

    for(var i in f.locations) { 
     var location = new google.maps.LatLng(f.locations[i].latitude, 
      f.locations[i].longitude); 
     var args = { 
      position : location, 
      map : googleMap, 
     }; 
     var marker = new google.maps.Marker(args); 
     var infoBox = config.infoBox; 
     var msg = config.infoBox; 

     for(var x in propertyList) { 
      var myExp = new RegExp('{{'+propertyList[x]+'}}'); 
      if(myExp.test(msg) && typeof(f.locations[i][propertyList[x]]) != 'undefined' && f.locations[i][propertyList[x]] != "") 
       msg = msg.split('{{'+propertyList[x]+'}}').join(f.locations[i][propertyList[x]]); 
      else if(myExp.test(msg)) 
       msg = msg.split('{{'+propertyList[x]+'}}').join(''); 
     } 

     setMessage(marker,msg); 
    } 

} 

function setMessage(marker, msg) { 
    var infoWindow = new google.maps.InfoWindow({ content : msg }); 
    google.maps.event.addListener(marker,'click',function(){ 
     if (openBoxes.length > 0) 
      openBoxes.pop().close(); 
     infoWindow.open(googleMap,marker); 
     openBoxes.push(infoWindow);   
    }); 
} 

更新：嗯，我想通了，如果我設置draggable：false，它會阻止地圖平移。現在我可以想出如何在地圖上拖動地圖時滾動頁面，我很樂意去做。

更新：明白了！我將觸摸事件附加到Google地圖容器「地圖」，並且工作正常！

更新：其實我仍然不足。它在我的桌面上工作正常，但不在我的iPhone上。它可以讓我上下滾動，但我似乎無法點擊任何標記。在我的桌面上，它的效果很好。頁面上下滾動，我可以點擊我的圖標。我注意到我的標記圖標上的點擊事件似乎沒有被解僱。有些事情必須阻止它。

Answer 1

我得到了它scrollwheel:false！雖然我不確定爲什麼會出現這種情況。

我解決了我的原始問題，將map參數設置爲false，然後將觸摸事件添加到地圖容器中，當我將手指向上和向下移動時，會將頁面上下滾動。但是，這引發了一個新問題，現在我無法再點擊標記了。爲了讓我點擊標記並獲得信息窗口，我必須點擊屏幕上的任意位置。這個問題並沒有發生在Droid上，只發生在iPhone上。另外，我注意到如果我將地圖移動到屏幕的左上角，問題就不會發生。

在iPhone 3G - 4和iOS 3.1 - 4.2的各種iPhone上進行測試後，我發現當我收到客戶的當前地址時，問題似乎即將到來。

爲了獲得客戶的當前位置，我首先嚐試使用iPhone和Android瀏覽器本機的「獲取當前位置」彈出窗口。如果他們點擊「不允許」，那麼他們可以輸入他們的郵政編碼並以此方式獲得。

這個問題似乎每次我通過表單提交使用我的當前位置時都會出現，而不是從彈出窗口中出現，所以我將調試工作集中在這一點上。

有一次，我需要將其轉換爲lat/long的郵政編碼。最初，我爲它設置了插件來查詢我稱之爲dataManager.php的php腳本。經理程序將採取郵政編碼並向谷歌地圖發出curl請求，將其轉換爲郵政編碼。然後它會將轉換後的位置返回給我的插件。

我沒有意識到，你可以從谷歌地圖API的地理編碼的權利。我所知道的就是那個我可以運行查詢的網址。所以我編輯我的代碼，使用API​​進行地理編碼，讓流程正常運行。

工作就像一個魅力。現在我點擊標記，信息窗口即將到來。雖然，我仍然不確定爲什麼這會修復它。這些事情得到處理的順序沒有任何變化。數據沒有什麼不同。所有不同的是第一步。也許這是一個時間問題。 API調用比創建兩個HTTP請求躍點要快得多。

Answer 2

你需要在選項