如何在angular 1.x中使用angularjs-google- map隐藏和显示地图

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.x.x/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angularjs-google-maps/2.x.x/angular-google-maps.min.js"></script>

var app = angular.module('myApp', ['uiGmapgoogle-maps']);

<div id="map-container">
  <ui-gmap-google-map center="map.center" zoom="map.zoom">
    <!-- 在这里添加其他地图相关的指令和配置 -->
  </ui-gmap-google-map>
</div>

app.controller('myCtrl', function($scope) {
  $scope.map = {
    center: {
      latitude: 37.7749,
      longitude: -122.4194
    },
    zoom: 8,
    showMap: true // 用于控制地图的显示状态
  };
});

<button ng-click="map.showMap = !map.showMap">切换地图显示</button>

<div id="map-container" ng-show="map.showMap">
  <ui-gmap-google-map center="map.center" zoom="map.zoom">
    <!-- 在这里添加其他地图相关的指令和配置 -->
  </ui-gmap-google-map>
</div>