2016-08-18 54 views
0

我一直在试图创建chart.js之堆积条形图因为它在每次更新的幻灯片动画这是很好的,而不是宪章具有易可创建堆积条形图,但有重新在每次更新图表(我试图给它制作动画,但由于某种原因,我太笨了)。如何使用Chart.js(或Chartist)创建动画更新堆叠条形图?

我正在使用的代码几乎是从字面上jtblin的github上一个裂口,但由于某些原因,它不适合我堆栈:酒吧只是坐在旁边给对方。以下是他的图表链接:http://jtblin.github.io/angular-chart.js/examples/stacked-bars.html。控制器链接:http://jtblin.github.io/angular-chart.js/examples/app.js

请在下面找到我的代码,请告诉我究竟做错了什么?

function chartJsWaveCtrl($scope) { 
    $scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; 
    $scope.type = 'StackedBar'; 
    $scope.series = ['2015', '2016']; 
    $scope.options = { 
     scales: { 
     xAxes: [{ 
      stacked: true 
     }], 
     yAxes: [{ 
      stacked: true 
     }] 
     } 
    }; 

    $scope.data = [ 
     [65, 59, 90, 81, 56, 55, 40], 
     [28, 48, 40, 19, 96, 27, 100] 
    ]; 
} 

原来的框架来自于模糊管理员,如果这是任何价值。

图片描述如何显示:

矿: my non-stacked bar chart using chart.js Jtblin的: jtblin's stacked bar chart using chart.js

请注意(我认为这可能是问题的症结所在)我使用Chart.JS 1.0.2。

或者,如果有人可以告诉我如何使用Chartist进行动画更新,那也会很棒。它更新得很好,它堆叠得很好,拥有我想要的所有东西,但是我无法使它变成动画。我会假设我必须做一个.on('draw',),但我不知道如何。

回答

相关问题