구글맵 API - 말풍선 달기

예제 를 먼저 보겠습니다.

지도를 클릭하면 마커가 추가되고, 마커에 마우스를 갖다 대면(mouseover 이벤트) 마커의 좌표를 말풍선으로 띄우도록 했습니다.

    function GM_load() {
        var map = new GMap2(document.getElementById("map"));
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(36.615527, 127.353515), 12);
        map.setUIToDefault();
        map.enableGoogleBar();

        GEvent.addListener(map, "click", function(overlay,point) {
            if (point) {
                lmarker = new GMarker(point);
                map.addOverlay(lmarker);
                lmarker.setImage("http://maps.google.com/mapfiles/ms/icons/red-pushpin.png");

                GEvent.addListener(lmarker, "mouseover", function(){
                    var myHtml = "<H3>Position is: <br>" +"[" + point.lat().toFixed(6) + ", " + point.lng().toFixed(6) + "]</H3>";
                    map.openInfoWindow(point, myHtml);
                });
            }
        });
    }

추가된 소스는 3줄입니다.
openInfoWindow 함수는 매개변수 2개가 필요합니다.
첫번째는 point - 위도/경도, 두번째는 말풍선에 표시할 텍스트인데 HTML도 가능합니다.