地圖在移動設備上顯示錯誤（使用JQuery移動設備）

我正在使用jQuery移動設備，並且必須顯示一些地圖。我使用了一個函數，每次單擊特定鏈接時都會創建地圖，但在生成第一個地圖之後，其他地圖會顯示錯誤。地圖在移動設備上顯示錯誤（使用JQuery移動設備）

這裏一個例子，第一張地圖：

First Map

其他地圖：

Second Map

我用這樣的函數：

function buildMap(div){ 

    var coord = new google.maps.LatLng(lat, lng); 

    var options = { 
     zoom: 13, 
     scrollwheel: false, 
     scaleControl: true, 
     mapTypeControl: false, 
     center: coord, 
     mapTypeId: google.maps.MapTypeId.HYBRID 
    }; 

    var map = new google.maps.Map(div, options); 

    return map; 
}

你能幫忙米è？

謝謝！

來源

2011-08-17 Mark Design

相關：HTTP：// jQuery的UI地圖。 googlecode.com/svn/trunk/demos/jquery-mobile-example.html –

問題解決了，你需要創建的「pageshow」事件地圖（jQuery的移動的事件）：

$('#map_page').live('pageshow',function(event, ui){ 
    buildResultMap('#map_canvas'); 
});

來源

2011-08-18 10:57:14

很好的解決方案，我實際上根據我的需求進行了修改像這樣，它也可以工作： '$（document）.live（'pageshow'，function（event，ui）{ initialize_map_with_properties（）; }）;'' – DemitryT

解決方法是觸發resize事件或不使用Ajax。 Phill已經引導你演示瞭如何使用使用Ajax的jQuery Mobile Google maps plugin（在頁面加載中調用$（'＃map_canvas'）.gmap（'refresh'）;該插件非常易於使用（特別是如果你已經知道。谷歌地圖語法）

來源

2011-08-17 15:16:20 johansalllarsson

不，沒什麼... 我試圖重寫函數，我添加了這個「google.maps.event.trigger（map，'resize' ）;「但是什麼也沒有發生，但是我注意到這個問題只發生在Android設備/ chrome/safari上，在iphone/ipad上都正常。我還注意到，在地圖加載後，如果我在瀏覽器或Android設備中縮放頁面（縮放縮放），地圖會自行修復。 –

如果您在頁面顯示上調整大小，應該可以工作。但在頁面展示上創建地圖也適用。 – johansalllarsson

是的，現在我在pageshow上創建地圖，它也可以工作......謝謝！ –

地圖在移動設備上顯示錯誤（使用JQuery移動設備）

回答

相關問題