谷歌地圖不希望加載

加載谷歌地圖時遇到問題。在我的頭部分，我有以下代碼（我有一個正確的谷歌API密鑰）谷歌地圖不希望加載

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script> 
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=MYKEY&sensor=false"></script> 
<style type="text/css"> 
    html { height: 100% } 
    body { height: 100%; margin: 0; padding: 0 } 
    #map_canvas { height: 100% } 
</style> 
<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>

和我的身體部分開始如下：

<div class="page"> 
    <div id="header"> 
     <div id="title"> 
      <h1>My MVC Application</h1> 
      <div id="map_canvas" style="width: 100%; height: 100%"></div>

這是行不通的。但是，當我移動身體後的「map_canvas」div：

<body onload="initialize()"> 
<div id="map_canvas" style="width: 100%; height: 100%"></div> 
    <div class="page"> 
     <div id="header">

它一切正常。你能幫我嗎。另外，我如何使用jQuery而不是調用initialize方法？

來源

2012-01-23 Piotr Ptak

嘗試像素的高度和寬度，而不是百分比，它應該工作 –

正如Bassam提到的，您需要設置明確的像素寬度和高度。否則，請查看用於page, header, and title元素的CSS。這些元素的寬度和高度需要級聯到map_canvas元素。

使用jQuery代替初始化，從body元件除去onload="initialize()"並添加上述initialize()函數下面的代碼：

$(document).ready(function() { 
    initialize(); 
});

來源

2012-01-24 04:51:07 andresf

谷歌地圖不希望加載

回答

相關問題