chart.js - 如何在 ChartJS 中绘制折线图？

Question

我创建了一个虚拟表，我想以“line”类型绘制盈亏列。到目前为止，这是我的代码:

 var niftyProfit = [];
 var niftyProfitChartData = [];
 var sum = 0;
 data.forEach(function(obj) {
     niftyProfit.push(obj.profit);
 });
 for (var i in niftyProfit) {
     sum = sum + niftyProfit[i];
     niftyProfitChartData.push(sum);
 }

obj.profit 是盈亏列数据，但采用折线图形式。我想填充该值，这是我在 for 循环中所做的，例如。考虑 profit = [4,2,-3,-5]，那么我在图表中填充的最终数组将变为 [4,6,3,-2]。我将如何实现这一目标？这是一个 fiddle :http://jsfiddle.net/zkrh7/141/

Answer 1

我已经用以下更改更新了 jsfiddle，它正在工作。

在脚本中

var data = [{"profit": 345}, {"profit":-4}, {"profit":58}, {"profit": -30}];
//or you can use
var data = [{"profit": 4}, {"profit":2}, {"profit":-3}, {"profit": -5}];

populateChartData(data);

并添加了图表库作为您也可以看到的外部资源。然后

我还将 Canvas 添加到了 html

<canvas id="niftyTrackerChart" width="800" height="400"></canvas>

更新了 JSFiddle 链接 http://jsfiddle.net/muasif80/zkrh7/156/

看看这个链接 How to uses numbers array for line chart?

这就是说，如果您只使用数字，那么您还必须为 x 轴定义一个标签数组。