마커가 Google지도에 표시되지 않음

Question

내지도에 마커를 표시하려고합니다. 하지만 그것들을 보여주지는 않습니다. 새로운 좌표를 클릭

var map; 
var markers = new Array(); 

function initialize() { 
    var mapOptions = { 
     zoom: 12, 
     center: new google.maps.LatLng(27.9881, 86.9253), 
    }; 
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

    google.maps.event.addListener(map, 'click', addMarker); 
} 

function addMarker(event) { 
    markers.push(event.latLng); 

    marker = new google.maps.Marker({ 
     position: event.latLng, 
     map: map 
    }); 

    console.log(markers); 
} 

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

콘솔이 모든 로깅되므로 함수가 호출되고, 좌표가 전달됩니다

이

은 내가 사용하는 코드입니다. 그리고 마커 코드에서 실제로 어떤 문제도 볼 수 없습니다.

누구나이 문제를 볼 수 있습니까?

Answer 1

map는 initialize 내부에만 표시 로컬 변수이다.

당신이 마커의 map -property 설정을 사용 this 대신 map의 :

function addMarker(event) { 
    markers.push(event.latLng); 

    marker = new google.maps.Marker({ 
     position: event.latLng, 
     map: this 
    }); 
} 

설명 :

콜백가 이벤트를 트리거하는 객체의 범위에서 실행됩니다 . 여기서는 클릭 리스너가지도에 적용 되었기 때문에 Maps 인스턴스이며, this은 콜백 내부에서이 객체를 참조합니다.

Answer 2

markers.push(event.latLng); 

여기 마커가 아니라 위도를 밀고 있습니다.

markers은 전역 범위를 갖는 배열 변수이고 은 로컬 변수입니다.
markers 배열에 각각 개인을 삽입하고 처리해야합니다.

function addMarker(event) { 
    var marker = new google.maps.Marker({ 
     position: event.latLng, 
     map: map 
    }); 
    markers.push(marker); 
}