Javascript 数据更新时如何更新D3图表

我使用D3图表在屏幕上显示数据。数据从WebApi更新。数据更新后，我想刷新图表中的数据

这是密码

 $scope.config = {
        title: 'Products',
        tooltips: true,
        labels: false,
        mouseover: function () { },
        mouseout: function () { },
        click: function () { },
        legend: {
            display: true,
            //could be 'left, right'
            position: 'right'
        }
    };


$http.put(WebApiURL.GetWebApiURL() + 'api/ReportPerformance', data)
     .then(function (response) {
         $scope.PerformanceData = response.data;
         $scope.LoadingData = "";
         $scope.chartdata = [];
         var tempchartdata = [];
         angular.forEach($scope.PerformanceData, function (value) {
             tempchartdata.push(value.ReportTimeInSeconds);
         });
         $scope.chartdata = tempchartdata;
     }), function errorCallback(x, y, z) {
         $scope.LoadingData = "Error while generating report:= " + x.ExceptionMessage;
     };
    }

此web调用正在更新数据

$scope.chartdata

html中的图表定义

<div data-ac-chart="'bar'"
     data-ac-data="chartdata"
     data-ac-config="chartConfig"
     style="height: 500px; width: 500px;"
     class="chart">
</div>

但当数据来自webApi时，它正在更新

$scope.chartdata

，但不会反映在屏幕上

---

添加了plunker

您应该查看指令中的

$scope.dataAcData

，并更新指令中的D3

scope.$watch('dataAcData',function(){
  //update your d3 here
})

---

尝试应用该方法，我认为它现在已更新，因为$digest在代码中不起作用。将代码包装起来

$scope.$apply(function () {
            //your code
        });




 $scope.$apply(function () {
            $scope.dataAcData
        });

go through http://jimhoskins.com/2012/12/17/angularjs-and-apply.html link, Hope it will help you

---

您可以提供fiddle吗？您需要将绘制/更新图表的代码放在

$http.put

回调中，或者添加

$scope.$watch

并将其放在那里。你能显示出绘制图表的实际代码吗？这是绘制图表的实际代码。你能给我举一些例子来说明你的建议吗，“这是绘制图表的实际代码”。。。你在说什么？代码中没有一行D3。我只是放弃了…我还没有为图表创建任何指令。我只是直接使用D3提供的任何东西，正如我在问题中提到的，它应该有一个指令，或者您将$scope.chartdata绑定到哪里？你的d3代码在哪里？你确定你没有使用角度图吗？因为我认为这些

数据ac数据

，

数据ac配置

用于

角度图表

指令。关于你的plunker，我没有看到任何关于d3的代码，它也没有在你的网页上画任何东西，你一定错过了一些东西，请访问