Google Map V3绘制多边形并打开InfoWindow

时间:2012-06-13 09:10:30

标签: javascript google-maps google-maps-api-3

我正在动态绘制一个多边形,然后点击多边形打开InfoWindow ..我正在成功绘制多边形,但是点击Infowindow似乎没有。不给出错误似乎没有!

这是我的所有代码;

       function ADD_EVENT_FOR_POLYLINE_AND_POLYGON () {
            GLOBALS.PolyGonPath = new google.maps.MVCArray;
            GLOBALS.PolyGon = new google.maps.Polygon({
                strokeWeight: 3,
                fillColor: '#5555FF'
            });
            GLOBALS.PolyGon.setMap(GLOBALS.Map);
            google.maps.event.addListener(GLOBALS.Map, 'click', DRAW_POLYGON);
        }


     function DRAW_POLYGON(event) {
        GLOBALS.PolyGonPath.insertAt(GLOBALS.PolyGonPath.length, event.latLng);
        var marker = new google.maps.Marker({
            position: event.latLng,
            map: GLOBALS.Map,
            draggable: true
        });
        GLOBALS.PolyMarkers.push(marker);
        marker.setTitle("#" + GLOBALS.PolyGonPath.length);
        google.maps.event.addListener(marker, 'click', function () {
            marker.setMap(null);
            for (var i = 0, I = GLOBALS.PolyMarkers.length; i < I && GLOBALS.PolyMarkers[i] != marker; ++i);
            GLOBALS.PolyMarkers.splice(i, 1);
            GLOBALS.PolyGonPath.removeAt(i);
        });

        google.maps.event.addListener(marker, 'dragend', function () {
            for (var i = 0, I = GLOBALS.PolyMarkers.length; i < I && GLOBALS.PolyMarkers[i] != marker; ++i);
            GLOBALS.PolyGonPath.setAt(i, marker.getPosition());
        });

        **Here is I am adding a method to polygon for infowindow**
        GLOBALS.PolyGon.setPaths(new google.maps.MVCArray([GLOBALS.PolyGonPath]));
        google.maps.event.addListener(GLOBALS.PolyGon, 'click', SHOW_INFO);
    },


     function SHOW_INFO (event) {
        var infowin = new google.maps.InfoWindow();
        var vertices = GLOBALS.PolyGon.getPath();
        var contentString = "<b>Test</b><br />";

        for (var i = 0; i < vertices.length; i++) {
            var xy = vertices.getAt(i);
            contentString += "<br />" + "Coordinats: " + i + "<br />" + xy.lat() + "," + xy.lng();
        }
        infowin = new google.maps.InfoWindow();
        infowin.setContent(contentString);
        infowin.setPosition(event.latLng);
        infowin.open(GLOBALS.Map, this);
    }

1 个答案:

答案 0 :(得分:0)

尝试更改SHOW_INFO函数中的最后一行代码:

infowin.setPosition(event.latLng); //Leave this line
infowin.open(GLOBALS.Map, this);

为:

infowin.setPosition(event.latLng); //This line stays the same
infowin.open( GLOBALS.Map );

infowin.open的第二个参数是一个可选的MVCObject参数,具有公共position属性,用作锚点。在这种情况下,您不需要提供锚点,因为您已经调用infowin.setPosition方法传递google.maps.LatLng。来自google.maps.InfoWindow方法的open api-doc说明:

  

在给定地图上打开此InfoWindow。可选地,InfoWindow可以   与锚相关联。在核心API中,唯一的锚是   标记类。但是,一个锚可以是暴露它的任何MVCObject   position属性和可选的anchorPoint用于计算   pixelOffset(参见InfoWindowOptions)。 anchorPoint是偏移量   从锚点的位置到InfoWindow的顶端。