2

我有一条可以包含很多点的折线，也可以根据用户行为进行更改，我目前使用的是Angular Google maps 1.2.x，就业策略如下：

 myService.getPoints(id)
     .success(function(data){
          //in other controller have $scope.p = pService
          pService.Polyline = [];

          for(var i=0;i<data.length;i++){
              var p = {
                  latitde : data.Latitudefield,
                  longitude : data.Longitudefield
               }
               pService.Polyline.push(p);
          }
     })

这行得通，但是当点数很多（大约4000点或更多）时，应用程序变得很慢，可以使用什么策略来处理这个问题？

4

1 回答 1

2

这就是我如何获得更快的渲染。

   $scope.trackings = [{
        id: 1,
        geotracks: [{
            latitude: 23.0,
            longitude: 72.58
        }, {
            latitude: 23.1,
            longitude: 72.58
        }]
    }, {
        id: 2,
        geotracks: [{
            latitude: 24.0,
            longitude: 72.58
        }, {
            latitude: 23.1,
            longitude: 71.58
        }]
    }];

<div class="row" ng-if="map.show">
    <ui-gmap-google-map center="map.center" zoom="map.zoom">
        <ui-gmap-polylines models="trackings" path="'geotracks'" static="true"></ui-gmap-polylines>
    </ui-gmap-google-map>
</div>

这里的关键是 static="true"。我必须将它全部包装在一个 ng-if="map.show" 中，当数据准备好时我将它设置为 true，因为 static 关键字使它成为静态的（而不是异步的）。希望这可以帮助 ：）

参考：http ://angular-ui.github.io/angular-google-maps/#!/api/polylines

static：布尔属性，表示折线坐标是静态的。（即不会改变）。

声明静态路径将提高指令的性能，因为它不需要在 Angular $digest 周期期间监视路径中的每个坐标以进行更改。

笔记：

声明静态路径意味着它不可编辑。因此，可编辑参数将被忽略。

对于静态路径，路径属性将通过引用进行监视，因此路径可能会全部更改并且地图将更新。

指令实例化后，静态声明的更改将被忽略。（未观看）

于 2014-11-24T11:36:21.753 回答