Javascript谷歌地图API - 标记不显示

Question

我有一个单独的.js文件中的以下代码，但由于某种原因制造商没有显示当我加载页面，只有地图。

document.addEventListener('DOMContentLoaded', drawMap); 

//MAP 

function drawMap() { 

    var myLatLong = new google.maps.LatLng(53.4680477, -2.2400482); 

     var mapOptions = { 
      center: myLatLong, 
      zoom: 14 
     }; 
     var map = new google.maps.Map(document.getElementById('map-canvas'), 
      mapOptions); 
     } 

//MARKERS 

var marker = new google.maps.Marker( 
    { 
     position: myLatLong, 
     map: map, 
     title: "Marker" 
    } 
); 

marker.setMap(map); 

Answer 1

试试这个

document.addEventListener('DOMContentLoaded', drawMap); 

//MAP 

function drawMap() { 

    var myLatLong = new google.maps.LatLng(53.4680477, -2.2400482); 

    var mapOptions = { 
     center: myLatLong, 
     zoom: 14 
    }; 
    var map = new google.maps.Map(document.getElementById('map-canvas'), 
    mapOptions); 

    //MARKERS 

    var marker = new google.maps.Marker({ 
     position: myLatLong, 
     map: map, 
     title: "Marker" 
    }); 

    marker.setMap(map); 
} 

Answer 2

我注意到，marker.setMap（图）在地图初始化之前添加。 尝试以下操作：从Google developers doc

function initialize() { 
    var myLatlng = new google.maps.LatLng(-25.363882,131.044922); 
    var mapOptions = { 
    zoom: 4, 
    center: myLatlng 
    } 
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

    var marker = new google.maps.Marker({ 
     position: myLatlng, 
     map: map, 
     title: 'Hello World!' 
    }); 
} 

google.maps.event.addDomListener(window, 'load', initialize); 

希望这有助于提供

function drawMap() { 
    // init maps then add marker to map 
    marker.setMap(map); 
} 

这里有一个例子。