Question

对于有角度的谷歌地图，如何删除折线？我在使用templateUrl的指令中使用带有JavaScript的角度版本1。

版本：angular-google-maps 2.1.5

这是我目前的HTML：

 <ui-gmap-google-map center="config.map.center" zoom="config.map.zoom" options="config.map.options" events="config.map.events" draggable="true">
        <ui-gmap-polygon path="compatiblePolygon" stroke="polygonConfig.stroke" fill="polygonConfig.fill" fit="true" static="false" visible="polygonConfig.visible" editable="true" draggable="true" clickable="true" events="polygonConfig.events">
        </ui-gmap-polygon>

        <ui-gmap-markers coords="'self'" options="marker.options" models="compatiblePoints" idkey="'id'" clickable="true" click="markerClicked">
        </ui-gmap-markers>

        <ui-gmap-drawing-manager options="drawingManager" static="false" events="config.drawing.events">
        </ui-gmap-drawing-manager>
    </ui-gmap-google-map>

这是我需要删除的折线的img：

到目前为止，我点击了我的清晰地图按钮尝试了这个：

scope.polygonConfig.events.setMap(null);

但我收到此控制台错误：

“无法读取属性'setMap'的未定义”

我也试过这个：

                   uiGmapIsReady.promise(1).then(function (instances) {
                        const map = instances.reduce(function(previous, current) {
                            return current.map;
                        });
                        scope.mapInstance = map;
                        map.setMap(null);
                    });

但我收到此错误：map.setMap不是函数

这是我最近的尝试：

              <ui-gmap-polygon path="compatiblePolygon" stroke="polygonConfig.stroke" fill="polygonConfig.fill" fit="true" static="true" visible="polygonConfig.visible" editable="polygonConfig.editable" draggable="polygonConfig.draggable" clickable="true" events="polygonManager.events">
              </ui-gmap-polygon>


                scope.polygonManager = {
                    events: {
                        rightclick: function(polygon) {
                          console.log("rightclick");
                          polygon.setMap(null);
                        },
                        dblclick: function(polygon) {
                          console.log("dblclick");
                          polygon.setMap(null);
                        }
                    }
                };

Answer 1

基于ui-gmap-polygon的文档：

events：要应用于多边形的自定义事件。这是一个关联数组，其中键是事件名称，值是处理函数。请参阅多边形事件。处理程序函数有四个参数（注意args正在扩展原始google sdk的默认args）：

1.多边形：GoogleMaps多边形对象

您可以使用events ui-gmap-polygon属性清除折线，如下所示：

$scope.events = {
    rightclick: function(polygon) {
        polygon.setMap(null);
    }
};

<ui-gmap-polygon ... events="events"></ui-gmap-polygon>

这将导致右键单击从地图中删除多边形。您还可以使用其他事件来触发此操作，这些事件列在此处：https://developers.google.com/maps/documentation/javascript/reference#Polygon
在“事件”部分下查看

修改：以下是展示此功能的示例：http://plnkr.co/edit/t7zz8e6mCJavanWf9wCC?p=info

对于角度谷歌地图，如何删除折线？

1 个答案: