初始化Google地图显示

我正在创建一个使用Google Maps API显示地图的网络应用程序。当我重新加载页面时，它不会初始化我的坐标告诉它并且“模糊”的地图。一旦我使用左侧的工具栏缩小并缩小一切都很好。这里是我的代码：初始化Google地图显示

<!DOCTYPE html> 
<html> 
<head> 
<title>Google Maps JavaScript</title> 
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> 
<meta charset="UTF-8"> 
<style type="text/css"> 
    html, body, #map_canvas { 
    margin: 0; 
    padding: 0; 
    height: 50%; 
    } 
</style> 
<script type="text/javascript" 
    src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
    var map; 
    function initialize() { 
    var myOptions = { 
     zoom: 14, 
     center: new google.maps.LatLng(2.3584170693, -71.065063476), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById('map_canvas'), 
     myOptions); 

    var bikeLayer = new google.maps.BicyclingLayer(); 
    bikeLayer.setMap(map); 

    var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(42.346872819794896, -71.06643676757812), 
     map: map, 
     title: 'REPORT' 
    }); 

    var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(42.363363955820496, -71.08978271484375), 
     map: map, 
     title: 'REPORT' 
    }); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
</head> 
<body> 
<div id="map_canvas" style="width: 90%; height: 300%"></div> 
</body> 
</html>

来源

2012-06-22 user1452463

您的内联高度与您的CSS高度相冲突，顺便说一句。 –

在Firefox中看起来很好。您是否在特定浏览器中遇到问题？请相应地编辑标签。 –

我正在使用safari – user1452463

我注意到你的标记是各地（42.3，-71），波士顿，但写在选择地图的中心，缺少一个“4”和发送功能的初始位置哥伦比亚在（2.3，-71）。

关于模糊性，它可能只是骑自行车层需要一段时间来加载？我无法重现这种效果。

来源

2012-06-22 20:28:39

是的！这是初始位置的问题。谢谢！我忘了'4'。 – user1452463

初始化Google地图显示

回答

相关问题