Question

Angular code和cordova插件获取地理位置：

$cordovaGeolocation
        .getCurrentPosition()
        .then(function (position) {
          $scope.map.center.lat  = position.coords.latitude;
          $scope.map.center.lng = position.coords.longitude;
          $scope.map.center.zoom = 18;
          $scope.map.markers.now = {
            lat:position.coords.latitude,
            lng:position.coords.longitude,
            focus: true,            
            draggable: false,
            //message: ''
          };

        }

在获取坐标并在地图上绘制之前，地图显示全局地图像这样：

these map is displayed until co-ordinates are fetched

IONIC HTML CODE：

<ion-view cache-view="false" title="Dashboard">
  <ion-content data-tap-disabled="true">
    <leaflet defaults="map.defaults" center="map.center" markers="map.markers" ng-if="map"></leaflet>

Answer 1

<强>控制器

$scope.loading = true;
$cordovaGeolocation
        .getCurrentPosition()
        .then(function (position) {
          $scope.loading = false;
          $scope.map.center.lat  = position.coords.latitude;
          $scope.map.center.lng = position.coords.longitude;
          $scope.map.center.zoom = 18;
          $scope.map.markers.now = {
            lat:position.coords.latitude,
            lng:position.coords.longitude,
            focus: true,            
            draggable: false,
            //message: ''
          };

        }

<强> HTML

<ion-view cache-view="false" title="Dashboard">
    <ion-content data-tap-disabled="true">
       <div class="spinner" ng-if="loading">Loading...</div>
       <leaflet defaults="map.defaults" center="map.center" markers="map.markers" ng-if="map && !loading"></leaflet>

显示加载GIF，直到获取坐标

1 个答案: