Question

我是否知道如何将这个动态线图堆叠起来？ http://jsfiddle.net/praveen_jegan/QBDGB/6/

var options = {
    series: {
        stack: true,
        lines: {
            show: true,
            fill: true
        }
    },

有人有任何例子吗？

Answer 1

您可以查看d3js.org上的streamgraph示例 http://bl.ocks.org/mbostock/4060954

Answer 2

您需要做的就是创建一个新数据集，它是旧数据的堆叠版本。

以下几行将针对您的示例执行此操作：

var data1s = data1;

var data2s = []; for(var i = 0; i < data1s.length; i++){data2s.push({time: data1[i].time, value:  data1s[i].value + data2[i].value}  )};

var data3s = []; for(var i = 0; i < data2s.length; i++){data3s.push({time: data2[i].time, value:  data2s[i].value + data3[i].value}  )};

var data4s = []; for(var i = 0; i < data3s.length; i++){data4s.push({time: data3[i].time, value:  data3s[i].value + data4[i].value}  )};

这是关于您可以创建此数据的最丑陋方式，但它有效。我创造了一个小提琴here.

请注意，在使我的小提琴工作时，我需要最初创建这些数据，参考这个新的堆叠数据代替原始数据，并更新堆叠数据。

堆叠动态线图d3.js

2 个答案: