谷歌地图示例不起作用

时间:2013-05-18 08:38:12

标签: google-maps

我正在尝试运行一个简单的谷歌地图示例(这是示例:https://developers.google.com/maps/documentation/javascript/examples/map-simple-async)。我把代码放在我的.hmtl文件中但是我得到一个空白页面。当然,这似乎发生在所有谷歌示例中(我将所有文件保存在ANSI格式中)。

代码是:

<!DOCTYPE html> <html>   <head>

<title>Asynchronous Loading</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<script>
    function initialize()
    {
        var mapOptions = {
            zoom: 8,
            center: new google.maps.LatLng(-34.397, 150.644),
            mapTypeId: google.maps.MapTypeId.ROADMAP};

        var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    }

    function loadScript()
    {
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = 'http://maps.googleapis.com/maps/api/js?key=<MY_CODE>&sensor=false&callback=initialize';
        document.body.appendChild(script);
    }

    window.onload = loadScript;

</script>   </head>   <body>
<div id="map-canvas"></div>   </body> </html>

1 个答案:

答案 0 :(得分:1)

在Google示例中,他们还包含指向CSS文件的链接。您在答案中的代码中没有任何CSS(内联或外部)。

看看他们的CSS文件,你需要类似的东西:

https://developers.google.com/maps/documentation/javascript/examples/default.css