angularjs nvd3折线图未更新数据

用户名

我正在使用angular-nvd3-directives创建折线图。

这是HTML文件

<div class="line-chart" ng-controller="LineChartController as viewAll">

    <nvd3-line-chart
    data="viewAll.linechart"
    id="exampleId"
    width="800"
    height="400"
    showXAxis="true"
    showYAxis="true"
    tooltips="true"
    interactive="true"
    xAxisTickValues="[1378387500, 1378388100, 1378388700, 1378389900]"
    xAxisTickFormat="xAxisTickFormatFunction()"
    margin="{left:50,top:50,bottom:50,right:50}">

        <svg></svg>

    </nvd3-line-chart>

</div>

这是JS文件

    (function() {
        var app = angular.module('linechart-directives', ['nvd3ChartDirectives', 'LocalStorageModule']);

        app.controller('LineChartController', function($scope, $http, localStorageService, $interval) {
                $scope.viewAll = this;
                $scope.viewAll.linechart = [];

                $scope.pollActiveCon = function() {
                        if (localStorageService.get("getAll") == 0 || localStorageService.get("getAll") == undefined) {
                                $http.get('/statistics/getAllData').success(function(data) {
                                        $scope.viewAll.linechart = data;
                                        localStorageService.set("getAllData",1);
                                });
                        }else{
                                $http.get('/statistics/getLastData').success(function(data) {
                                        if ($scope.viewAll.linechart[0]==null) {
                                                $scope.viewAll.linechart = data;
                                        }else{
                                                console.log($scope.viewAll.linechart);
                                                $scope.viewAll.linechart[0]['values'].push(data[0]['values'][0]);
                                        }
                                });     
                        }
                };

                $scope.pollActiveCon();

                $interval( function(){ 
                        $scope.pollActiveCon();
                }, 120000);

                $scope.xFunction =function(){
                        return function(d){
                                return d[0];
                        }
                }

                $scope.yFunction = function(){
                        return function(d){
                                return d[1];
                        }
                }
                $scope.xAxisTicksFunction = function() {
                        console.log('xAxisTicksFunction');
                        console.log(d3.svg.axis().ticks(d3.time.minutes, 5));
                        return function(d) {
                                return d3.svg.axis().ticks(d3.time.minutes, 5);
    };                                                     
                };                                                             
                $scope.xAxisTickFormatFunction = function() {                  
                        return function(d) {                                   
                                return d3.time.format('%H:%M')(moment.unix(d).toDate());
                        };                                                              
                };                                                                      

        });                                                                             
})();                                                                                   

问题是图表中的数据没有更新,但是当我检查$ scope.viewAll.linechart变量时,最后一个数据已成功添加到其中。我想念什么?

用户名

将其添加到html objectEquality =“ true”可解决该问题。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

NVD3折线图显示X轴

来自分类Dev

使用ajax传递数据时,NVD3折线图不显示-data.map不是函数

来自分类Dev

使用ajax传递数据时,NVD3折线图不显示-data.map不是函数

来自分类Dev

D3,NVD3折线图隐藏选项

来自分类Dev

如何在Angular nvd3折线图上添加工具提示

来自分类Dev

nvd3折线图,x轴上有字符串值

来自分类Dev

格式化nvd3折线图轴

来自分类Dev

在xAxis上使用datetype时,NVD3折线图tics与网格错误对齐

来自分类Dev

NVD3折线图-具有独立事件的叠加点

来自分类Dev

nvd3折线图,x轴上有字符串值

来自分类Dev

格式化nvd3折线图轴

来自分类Dev

d3折线图和面积图未使用新数据数组更新

来自分类Dev

nvd3:在折线图后面设置背景填充

来自分类Dev

如何在 NVD3 折线图中设置启用/禁用数据集?

来自分类Dev

AngularJS数组中的简单折线图

来自分类Dev

如何将字符串值添加到nvd3折线图x轴值?

来自分类Dev

如何在Angular NVD3折线图中的工具提示系列中添加更多属性

来自分类Dev

如何在nvd3折线图中隐藏第二个轴

来自分类Dev

AngularJS 为 MultiBar Chart NVD3 准备数据

来自分类Dev

angularjs-nvd3-指令更新数据

来自分类Dev

在rChart NVD3(nPlot)中向折线图添加垂直折线

来自分类Dev

D3-2个折线图的单独工具提示值-使用AngularJS

来自分类Dev

AngularJS未知提供程序nvd3

来自分类Dev

AngularJS未知提供程序nvd3

来自分类Dev

d3折线图未显示数据-基于教程

来自分类Dev

nvd3库,如何自定义折线图

来自分类Dev

在angular-nvd3折线图中动态放大y轴范围

来自分类Dev

D3中的折线图动态数据更新

来自分类Dev

D3中的折线图动态数据更新

Related 相关文章

热门标签

归档