地图在移动设备上显示错误（使用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移动设备）

回答

相关问题