구글맵 API - 마커를 드래그하자

마커를 드래그가 가능한 형태로 바꿔보겠습니다.

예제보기




    function initialize() {

      if (GBrowserIsCompatible()) {

        var map = new GMap2(document.getElementById("map_canvas"));

        var center = new GLatLng(37.4419, -122.1419);

        map.setCenter(center, 13);

        var marker = new GMarker(center, {draggable: true});

        GEvent.addListener(marker, "dragstart", function() {

          map.closeInfoWindow();

        });

        GEvent.addListener(marker, "dragend", function() {

          marker.openInfoWindowHtml("Just bouncing along...");

        });

        map.addOverlay(marker);

      }

    }




중요한 코드는 한줄입니다.

var marker = new GMarker(center, {draggable: true});

마커를 생성할 때 옵션으로 draggable을 지정해 줬습니다.


그리고 dragstart 이벤트가 발생하면 closeInfoWindow를, 

dragend 이벤트가 발생하면 openInforWindowHtml을 호출했습니다.


아주 간단한 예제입니다.




출처 : http://code.google.com/intl/ko/apis/maps/documentation/examples