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); 
} 

這裏有一個例子。