android google map api 참고문서

원문보기 : GoogleMap Open API #4 - 마커만들기.

지난강의 :
GoogleMap Open API #1 - 구글맵 시작하기. 
GoogleMap Open API #2 - 컨트롤러 만들기. 
GoogleMap Open API #3 - class GMap2 활용하기.

 -------------------------------------------------------------------------------------------

 구글맵에 위치를 표시하기 위해서 사용하는 것이 마커입니다. 

 기본적으로 좌표만 있으면, 마커를 만드실 수 있습니다. 

 그리고 추가적으로 마커의 이미지를 변경할 수 있으며, 말풍선 라벨을 달 수 있습니다. 

 그럼 간단하게 마커의 생성과 말풍선 다는 동작 등에 대해서 간단히 살펴보도록 하겠습니다. 


-----------------------------------------------------------------------------------------------


 1. 마커 생성. 
   
     화면 지도의 중심좌표를 마커의 좌표로 잡아서, 마커를 생성하는 코드입니다.  

     var point = map.getCenter(); // 중심좌표를 가져옴. 
     var marker = new GMarker(point);


 2. 마커 그리기

   마커 생성 한 후에 마커를 지도 위에 그리는 코드입니다. 
   addOverlay 를 해야 마커가 지도 위에 나타나게 되며, removeOverlay 를 통해서 마커를 삭제하실 수 있습니다.

    map.addOverlay(marker);  // 마커 그리기.
    //map.removeOverlay(marker); //마커 삭제


 3. 좌표 이동시 중심 마커 이동하기. 

  간단한 응용예제로써,  지도를 움직일 때마다 마커가 지도의 중심으로 오도록 하는 코드입니다. 
  이벤트 핸들러를 통해서, 마우스의 움직임이 끝날때, 중심좌표를 받아서 마커의 좌표를 움직이도록 합니다. 

  // 마우스 이벤트를 동작이 끝날 때로 설정. 
  GEvent.addListener(map, "moveend", function() {   
           var point = map.getCenter();   // 중심좌표 가져오기.
           marker.setPoint(point);
  });

    
 4. 마커에 말 풍선 달기. 
 
 마커위에 말풍선을 달 수 있습니다. 

 var html = '말풍선 테스트 입니다.';
 marker.openInfoWindowHtml(html);
 

 5. 마커에 마우스 오버시 말풍선 달기. 

 마커위에 마우스를 올려놓았을 때, 말풍선이 나타는 간단한 응용예제 입니다.
 마우스 이벤트를 'mouseover' 로 설정하고, 수행동작을 코드합니다. 

  GEvent.addListener(marker, "mouseover", function() {   
               marker.openInfoWindowHtml('마커위의 말풍선입니다.');
  });


 6. 마커에 마우스 클릭시 말풍선 달기.

 마커를 마우스로 클릭하였을, 말풍선이 나타는 간단한 응용예제 입니다.
 마우스 이벤트를 'click' 으로 설정하고, 수행동작을 코드합니다.
 마우스오버 이벤트는 독립적으로 마우스오버와 마우스클릭에 각기 다른 이벤트를 설정하실 수 있습니다.  

  GEvent.addListener(marker, "click", function() {   
               marker.openInfoWindowHtml('클릭하셨습니다.');
  });

 ----------------------------------------

 예제의 '소스보기'를 통해서 전체 코드를 직접 살펴보시면, 보다 빠르게 이해하실 수 있습니다. 
 Google Reference 를 참고 자료로 활용하였습니다. 

 예제보기     참고자료 

구글맵, OPENAPI, 매쉬업, 웹2.0

[출처] GoogleMap Open API #4 - 마커만들기.|작성자 Sync