Question

我是JavaScript的新手，我想从Google V2迁移到Google v3，为此我只是更改了V2中使用的方法，但是当我尝试更改addListener时V2到V3我遇到像v2这样的问题同样的监听器用于将标记放在地图上但是当涉及到V3时我无法在地图上放置标记。这里我发布了v2代码和V3代码。请发布帮我解决问题。 V2是：

GEvent.addListener(map, "click", function(marker, point) {
                console.debug('after Click map is '+map+' marker is '+marker+' point is '+point);
                if (marker) {
                        if(PolygonMarkers.length == 1){ //Only one marker in the array
                            map.removeOverlay(PolygonMarkers[0]);
                            map.removeOverlay(PolygonMarkers[0]);
                            PolygonMarkers = [];
                            if(Polygon){map.removeOverlay(Polygon)};
                        } else{                     /*More then one marker*/
                            var RemoveIndex = -1;
                            var Remove;
                            //Search for clicked Marker in PolygonMarkers Array
                            for(var m=0; m<PolygonMarkers.length; m++)
                            {
                                if(PolygonMarkers[m].getPoint().equals(marker.getPoint()))
                                {
                                    RemoveIndex = m; Remove = PolygonMarkers[m];
                                    break;
                                }
                            }
                            //Shift Array elements to left
                            for(var n=RemoveIndex; n<PolygonMarkers.length-1; n++)
                            {
                                PolygonMarkers[n] = PolygonMarkers[n+1];
                            }
                            PolygonMarkers.length = PolygonMarkers.length-1 //Decrease Array length by 1
                            map.removeOverlay(Remove); //Remove Marker
                            geofencedetails.drawPolygon(); //Redraw Polygon
                          }  

                        allMarkers = PolygonMarkers;

                  } else {
                    // Adds a new Polygon boundary marker 
                        var markerOptions = { icon: icon, draggable: true };
                        var marker = new GMarker(point, markerOptions);
                        PolygonMarkers.push(marker); //Add marker to PolygonMarkers array
                        map.addOverlay(marker); //Add marker on the map
                        GEvent.addListener(marker,'dragstart',function(){ //Add drag start event
                            marker.setImage(icon.image);
                            polygon_resizing = true;
                        });
                        GEvent.addListener(marker,'drag',function(){ 
                            geofencedetails.drawPolygon(); 
                            }); //Add drag event
                        GEvent.addListener(marker,'dragend',function(){   //Add drag end event
                            marker.setImage(icon.image);
                            polygon_resizing = false;
                            geofencedetails.drawPolygon();
                        });
                        geofencedetails.drawPolygon();

                        allMarkers = PolygonMarkers;
                 }
                });`

和V3是

        google.maps.event.addListener(map, "click", function(marker, point) {
            if (marker) {
                //console.debug('marker '+marker.toSource());
                if(PolygonMarkers.length == 1){ //Only one marker in the array
                    map.removeOverlay(PolygonMarkers[0]);
                map.removeOverlay(PolygonMarkers[0]);
                PolygonMarkers = [];
                if(Polygon){
                    map.removeOverlay(Polygon)
                };
                }else {                     /*More then one marker*/
                    //console.debug('PolygonMarkers.length is '+PolygonMarkers.length);
                    var RemoveIndex = -1;
                    var Remove;
                    //Search for clicked Marker in PolygonMarkers Array
                    for(var m=0; m<PolygonMarkers.length; m++){
                        //console.debug('PolygonMarkers['+m+'] '+PolygonMarkers[m]);
                        if(PolygonMarkers[m].getPosition().equals(marker.getPosition())){
                            //console.debug('Both are equal ');
                            RemoveIndex = m;
                            Remove = PolygonMarkers[m];
                            break;
                        }
                    }
                    //Shift Array elements to left
                    for(var n=RemoveIndex; n<PolygonMarkers.length-1; n++){
                        PolygonMarkers[n] = PolygonMarkers[n+1];
                    }
                    PolygonMarkers.length = PolygonMarkers.length-1 //Decrease Array length by 1
                    /*map.removeOverlay(Remove); //Remove Marker*/
                    for (var i = 0; i < allMarkers.length; i++ ) {
                        allMarkers[i].setMap(null);
                    }
                    geofencedetails.drawPolygon(); //Redraw Polygon
                }  

                allMarkers = PolygonMarkers;

            } else {
                //console.debug('In else block');
                // Adds a new Polygon boundary marker 
                var markerOptions = { icon: icon, draggable: true };
                //console.debug('1');
                var marker = new GMarker(point, markerOptions);
                //console.debug('2');
                PolygonMarkers.push(marker); //Add marker to PolygonMarkers array
                //console.debug('3');
                map.addOverlay(marker); //Add marker on the map
                //console.debug('4');
                GEvent.addListener(marker,'dragstart',function(){ //Add drag start event
                    //console.debug('5');
                marker.setImage(icon.image);
                //console.debug('6');
                polygon_resizing = true;
                });
                GEvent.addListener(marker,'drag',function(){ 
                    geofencedetails.drawPolygon(); 
                }); //Add drag event
                GEvent.addListener(marker,'dragend',function(){   //Add drag end event
                    marker.setImage(icon.image);
                polygon_resizing = false;
                geofencedetails.drawPolygon();
                });
                geofencedetails.drawPolygon();

                allMarkers = PolygonMarkers;
            }
        });

Answer 1

您需要将click事件绑定到标记而不是地图。

google.maps.event.addListener(marker, "click", function(event) { .... } );

Google Maps API V3中的UI事件通常会传递一个事件参数，可以由事件监听器访问，注意UI 事件发生时的状态。例如，UI“点击”事件通常传递一个包含latLng属性表示的MouseEvent 点击地图上的位置。请注意，此行为是唯一的 UI事件; MVC状态更改不会在其事件中传递参数。

Google V3添加单击“侦听器”

1 个答案: