Question

我有一条折线，可以包含很多点，也可以根据用户行为进行更改，我目前正在使用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点或更多）时，应用程序变得非常慢，可以使用什么策略来处理这个问题？

Answer 1

这就是我如何才能更快地渲染。

   $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 $摘要周期中监视路径中的每个坐标以进行更改。

注意：

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

对于静态路径，路径属性将通过引用进行观察，因此路径可能会完整更改，地图也会更新。

实例化指令后，将忽略对静态声明的更改。（没看过）

Angular谷歌地图动态折线有很多点

1 个答案: