Angular 谷歌地图 - 超时和折线渲染

Question

我负责开发一个 AngularJS 应用程序，该应用程序的目的是跟踪选定驱动程序的路线。 我从集成在我的应用程序后端的代理脚本获取路线，并使用this 插件来渲染地图和路线（使用折线对象制作）。

一切正常，但我需要延迟折线渲染，也就是说，对于每条路线，我不希望立即追踪整个路线，而是每 3 秒一条折线，这样可以模拟一个点在地图。

我试过这个（在$http.get 承诺的success 方法内）：

        var fn = function() {
            //alert(xpath);
            $scope.polylines[0].path.push(xpath);
        }

        for (var i = 0; i < $scope.paths.length; i++) {
                var p = $scope.paths[i];
                for (var j = 0; j < p.path.length; j++) {
                    xpath = p.path[j];
                    //$scope.polylines[0].path.push(xpath);
                    $timeout(fn, 1000);
                }
         }

其中$scope.paths 是纬度、经度对象的集合。 以这种方式使用$timeout 指令不起作用，如果我注释超时行并取消注释它上面的行（尽管所有路由都立即呈现）。 任何帮助表示赞赏。

Answer 1

var pushPath = function (path) {
    return function () {
        $scope.polylines[0].path.push(path);
        console.debug('pushed ' + path);
    };
};

for (var i = 0; i < $scope.paths.length; i++) {
    var p = $scope.paths[i];
    for (var j = 0; j < p.path.length; j++) {
        xpath = p.path[j];

        $timeout(pushPath(xpath), 1000);
    }
}

http://plnkr.co/edit/Rx01zw7YuM64QF90puqR?p=preview