如何在angularjs中重新绘制flot图表？

我正在使用绘制一个堆叠条形图。当我对端点进行异步调用以获取图表的数据时，它无法显示。我怀疑它需要重新绘制。有一个函数看起来像是重新绘制flot图表。请帮我用Angularjs重新绘制flot图表

<flot dataset="tasksRunData" options="tasksRunChartOptions" class="center-block" width="100%" height="400px" id="reportTasksRunRange.id"></flot>

angular.module('myApp').controller('Step2Controller', function($scope, $location, $interval, dialogs, $modal, $transition, ReportingService) {

    ...

    $scope.tasksRunData = mainArray;
    $scope.tasksRunChartOptions = {
        legend: {
            show: true,
            margin: 2
        },
        xaxis: {
            ticks: yaxisArray,
            alignTicksWithAxis: "right"
        },
        grid: {
            labelMargin: 10,
            hoverable: true,
            borderWidth: 0
        },
        series: {
            stack: true
        },
        colors: colorCodesArray,
        tooltip: true
    };

    ...
    $scope.redrawTasksRunDataHistoByChart();
    ...

    $scope.redrawTasksRunDataHistoByChart = function() {
        $scope.tasksRunData.draw(); //TypeError: undefined is not a function
        alert("AAAA");
    }
});

angularjs服务

angular.module('myApp')
    .service('ReportService', function ReportService($http, $q) {

        var getTasksRunDateHistoByType = function() {
            var deferred = $q.defer();
            $http({
                method: 'POST',
                url: "http://localhost:4040/reports/taskRun",
                data: '{ "client_user_info": { "client_id": "MU03"}}'
            }).
            success(function(result, status, headers, config) {
                deferred.resolve(result);
            }).
            error(function(result, status, headers, config) {
                console.log("Error");
            });
            return deferred.promise;
        };

        return {
            getTasksRunDateHistoByType: getTasksRunDateHistoByType
        };
    });

---

查看该指令的源代码，当

$scope.dataset

更改时，它将自动重新绘制

  $scope.redrawChart = function() {
    var tmp = [];
    for (var i = 0; i < 10; i++){
      tmp.push([i,Math.random() * 10]);
    }
    $scope.dataset = [{ data: tmp }];
  };

---

请参阅更新。

hmm。。不确定当通过rest端点接收数据时，为什么我的flot没有被渲染。应用硬编码相同数据时，Flot图表显示正确。我在chrome调试器中验证了数据。有没有一种方法可以手动触发angularjs中的重新绘制？@abi1964，与其尝试解决您的问题，不如用问题的细节（异步调用）更新您的问题。用新数据显示重新分配

$scope.dataset

的代码。谢谢。请你看一看扩展版好吗？

  $scope.redrawChart = function() {
    var tmp = [];
    for (var i = 0; i < 10; i++){
      tmp.push([i,Math.random() * 10]);
    }
    $scope.dataset = [{ data: tmp }];
  };

   $scope.renderTasksRunDateHistoByType = function(jsonInput) {
      $scope.dataset = [{
        data: jsonInput
      }];

      //console.log(jsonInput);
      //$scope.tasksRunData = mainArray;
      //$scope.tasksRunChartOptions
      //getting data here once response is received from server
    };