Google Maps API V3标记不加载

Question

我想要在Google地图上显示一个标记，以显示我正在执行的网站。如果没有标记代码，地图加载正常，并显示正确的位置（无标记），当我添加标记代码时，地图不再加载。显然我错过了一些简单的东西，但我对Jquery并不太熟悉。

<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="https://maps.googleapis.com/maps/api/js?key=AIzaSyBWJYTBt3bKUIsQKKsQPSnR1IHNdkAmBQs&sensor=false"> 
</script> 
<script type="text/javascript"> 
    function initialize() { 
    var mapOptions = { 
     center: new google.maps.LatLng(53.154662, -1.208357), 
     zoom: 15, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("map-canvas"), 
     mapOptions); 
    } 
var marker = new google.maps.Marker({ 
    position:(53.154662, -1.208357), 
    map: map-canvas, 
    title:"Hello World!" 
}); 
    google.maps.event.addDomListener(window, 'load', initialize); 

</script> 

感谢您的任何帮助。

Answer 1

的map -property有望成为一个google.maps.Map -instance和位置属性已成为google.maps.LatLng：

而且您必须创建在地图上已经已经创建了标记，并在一个范围内，其中maps-instance可以访问，例如在initialize()的末尾。

function initialize() { 
    var mapOptions = { 
     center: new google.maps.LatLng(53.154662, -1.208357), 
     zoom: 15, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("map-canvas"), 
     mapOptions); 

    var marker = new google.maps.Marker({ 
     position:new google.maps.LatLng(53.154662, -1.208357), 
     map: map, 
     title:"Hello World!" 
    }); 
    }