添加原始数据简单的方式来dc.js通过Ajax复合图表(Simple way to add raw

我具有2个折线图的复合图表但是我需要的第三图表添加到它。

这第三张图表将这些独特的性质：

该数据将通过Ajax呼叫进来，可作为二维阵列[[时间戳，值]，[时间戳，值] ...]
每一个新的Ajax调用需要更换前一个的值
它不需要尊重任何过滤器，不会对任何其他图表使用
然而，将需要使用不同地缩放Y轴。（和右边标记的话）

这就是图目前的样子，只有图表二

这是我的代码与第三线图的开始......假设我有我在来处理这一点的最好/最简单的方法有点亏可用的新数据的阵列。

timeChart
    .width(width).height(width*.333)
    .dimension(dim)
    .renderHorizontalGridLines(true)
    .x(d3.time.scale().domain([minDate,maxDate]))
        .xUnits(d3.time.months)
        .elasticY(true)
        .brushOn(true)
        .legend(dc.legend().x(60).y(10).itemHeight(13).gap(5))
    .yAxisLabel(displayName)
    .compose([
      dc.lineChart(timeChart)
      .colors(['blue'])
      .group(metric, "actual" + displayName)
      .valueAccessor (d) -> d.value.avg
      .interpolate('basis-open')
      .dimension(dim),
    dc.lineChart(timeChart)
      .colors(['red'])
      .group(metric, "Normal " + displayName)
      .valueAccessor (d) -> d.value.avg_avg
      .interpolate('basis-open'),
     dc.lineChart(timeChart)
        .colors(['#666'])
        .y()#This needs to be scaled and labeled on the right side of the chart
        .group() #I just want to feed a simple array of values into here
     ])

也侧面说明：我发现我可能是一个小bug与传说的渲染。正如你可以在图例中看到这两个具有相同的标签，但我已经在第二。集团（）的参数使用不同的字符串。

Answer 1:

目前最好的办法是创建一个伪造的组。真的.data上的图表方法应该做到这一点，但它不会为从堆栈中混入得出的图表工作。

https://github.com/dc-js/dc.js/wiki/FAQ#filter-the-data-before-its-charted

Answer 2:

我相信你在这里问了几个问题。我会尽量回答的主要问题：你如何将数据添加到一个直流图表。

我创建了一个例子在这里： http://jsfiddle.net/djmartin_umich/qBr7y/

在这个例子中，我只是随机数据添加到crossfilter，虽然这可以很容易地适用于从服务器获取数据：

function AddData(){
  var q = Math.floor(Math.random() * 6) + 1;
  currDate = currDate.add('month', 1);
  cf.add( [{date: currDate.clone().toDate(), quantity: q}]);  
  $("#log").append(q + ", ");
}

我把这种方法一次第二。一旦完成后，我重新在x域，重新绘制图表。

window.setInterval(function(){
  AddData();
  lineChart.x(d3.time.scale().domain([startDate, currDate]));
  dc.redrawAll();
}, 1000);

我建议尝试尝试添加多个y轴尺度的复杂性之前得到孤立这个工作。

文章来源: Simple way to add raw data to dc.js composite chart via Ajax