2012-05-06 34 views
1

我创建了一个名为maps.php的PHP文件,其中包含一个简单的Google Maps API,可在iPad的默认浏览器上运行。如何使用电话差距或科尔多瓦ajax谷歌地图

但是当我使用Ajax调用它时,页面会自行加载,但不是地图。如果我在桌面或移动浏览器中打开链接,它可以正常工作。

回答

2

您可以通过访问谷歌的javascript api来显示谷歌地图。

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map_canvas { height: 100% } 
    </style> 
    <script type="text/javascript" 
     src="http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=SET_TO_TRUE_OR_FALSE"> 
    </script> 
    <script type="text/javascript"> 
     function initialize() { 
     var myOptions = { 
      center: new google.maps.LatLng(-34.397, 150.644), 
      zoom: 8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map_canvas"), 
      myOptions); 
     } 
    </script> 
    </head> 
    <body onload="initialize()"> 
    <div id="map_canvas" style="width:100%; height:100%"></div> 
    </body> 
</html>

或者你可以在web视图通过window.location="http://www.mourady.me/alhokair/iphone/maps.php" JavaScript方法直接加载任何PHP页面,为你的PHP页面包含谷歌地图在canvas标签,你无法加载通过Ajax调用DIV,更好的方式使用iframe标签到工作。

<html> 
    <body onload="bodyload()"> 
     <button onclick="bodyload()">Ajax call</button> 
     <iframe id="mapDiv" height=500px width=700px src="http://www.mourady.me/alhokair/iphone/maps.php"></iframe> 
    </body> 
</html> 
+0

非常感谢您的帮助,但我解决了它,但似乎我被误解了。事实证明,我必须加载谷歌地图API在索引页面和调用地图的AJAX只有初始化函数不谷歌地图API – Bakly

相关问题