Question

我的项目与gps和跟踪系统有关。我使用drawingManager在google maps api v3上绘制地理围栏。我需要一个按钮，点击它将显示/隐藏所有drawingManager数字。在我的项目中，我也使用angularJS。我有2个不同的指令。在1-st i声明drawingManager

var polyOption = {
    fillColor: '#ffff00',
    fillOpacity: 0.4,
    strokeWeight: 1,
    clickable: true,
    editable: true,
    zIndex: 1
};
drawingManager = new google.maps.drawing.DrawingManager({
    drawingControl: true,
    drawingControlOptions: {
        position: google.maps.ControlPosition.BOTTOM_CENTER,
            drawingModes: [
              google.maps.drawing.OverlayType.MARKER,
              google.maps.drawing.OverlayType.CIRCLE,
              google.maps.drawing.OverlayType.POLYGON,
              google.maps.drawing.OverlayType.POLYLINE,
              google.maps.drawing.OverlayType.RECTANGLE
            ]
     },
     circleOptions: polyOption,
     rectangleOptions: polyOption,
     polygonOptions: polyOption,
     polylineOptions: polyOption,
});
scope.geozonesConfig.tempDrawManagerVar = true;
scope.geozonesConfig.tempDrawManagerHide = false;
drawingManager.setMap(map);


google.maps.event.addListener(drawingManager, 'overlaycomplete', function(e) {
    if (e.type != google.maps.drawing.OverlayType.MARKER) {
        // Switch back to non-drawing mode after drawing a shape.      
        drawingManager.setDrawingMode(null);
        // To hide:              
        // Add an event listener that selects the newly-drawn shape when the user
        // mouses down on it.
        var newShape = e.overlay;                      
        newShape.type = e.type;
        google.maps.event.addListener(newShape, 'click', function() {
          setSelection(newShape);
          scope.$apply (function () {
            scope.geozonesConfig.showGeozoneConfig = true;
          });
        });
    setSelection(newShape);
});
google.maps.event.addListener(drawingManager, 'drawingmode_changed', clearSelection);
google.maps.event.addListener(map, 'click', clearSelection);
google.maps.event.addDomListener(document.getElementById('delete-button'), 'click', deleteSelectedShape);
buildColorPalette();

有我的按钮。我用过ng-click：

 <a href="javascript:void(0)" title="{{ 'Add geozone' | translate }}" ng-click="onGeozoneClick()"><i class="icon-globe"></i></a>

`我的函数位于另一个指令中：

 scope.onGeozoneClick = function () {
            alert('Show/Hide all figures');
 };

如何显示/隐藏这些drawingManager数据？感谢。

编辑：从OP的回复更新为答案

我怎样才能在js中做到这一点？我不知道如何参考我的数字。据我所知，谷歌地图api中没有任何关于这些数字的方法。现在我尝试使用figuresOptions的visible属性来做到这一点： var anchorShowHideFigure = true; var polyOption = {visible = anchorShowHideFigure }; 然后我想在点击按钮后将更改标志设置为false。如果我将写入我的第一个指令： function showHideDrawingFigures () { anchorShowHideFigure = false; }; 在控制台我得到：＆＃34; showHideDrawingFigures没有定义＆＃34;。如果我将它写入2-nd指令我得到：＆＃34; anchorShowHideFigure未定义＆＃34;我得到这个，因为我的html文件使用2-nd指令。对不起，如果我错误地解释 -

Answer 1

结帐ng-show＆amp; ng-hide指令。

在$ scope中创建一个标记为showFigures的标志。用于切换fla

$scope.onGeozoneClick = function () {
        $scope.showFigures = false;
 };

在HTML中，

<div ng-show="showFigures"></div>

显示/隐藏在drawingManager中绘制的所有图形

1 个答案: