javascript - 在DC JS中创建堆叠的条形图

标签 javascript d3.js dc.js

我正在尝试使用按名称和日期维度拆分的组在DC JS中制作堆叠式条形图

日期维度:

var date_dim = ndx.dimension(function(d) { return  d.date;});


以及一些按名称分组的数字数据

var names_grouping = names_dim.group().reduceSum(function(d){
  return d.dep_var
})


我以前曾使用过相同的分组和按季度分组,以成功生成一个饼形图,该饼形图按名称显示了数值数据的份额:

enter image description here

产生饼图的代码:

var namechart = dc.pieChart('#sales-by-nameplate')
namechart 
    .width(200)
    .height(200)
    .radius(80)
    .innerRadius(30)
    .dimension(names_dim)
    .group(name_grouping)
    .renderLabel(false);


names_dim是这样的:

var names_dim = ndx.dimension(function(d) { return d.name; });


假设数据已经按名称分组,是否可以使用现有名称组和日期维度创建堆积面积图?

最佳答案

您的意思是barchart对(最后一句话)?

您可以使用stack方法,但我想您想按date_dim分组:

barChart
   .dimension(date_dim)
   .group(date_dim.group().reduceSum(function(d) { return d.names_dim === 'Name 1' ? 1 : 0; }), "Name 1")
   .stack(date_dim.group().reduceSum(function(d) { return d.names_dim === 'Name 2' ? 1 : 0; }), "Name 2")
   .stack(date_dim.group().reduceSum(function(d) { return d.names_dim === 'Name 3' ? 1 : 0; }), "Name 3")


与不同名称的数量一样多的堆栈。

关于javascript - 在DC JS中创建堆叠的条形图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32606609/

相关文章:

legend - 在 dc.js 中为饼图添加图例

javascript - 分层平面数据,而无需直接指定父级

javascript - D3.js:使用鼠标滚轮滚动缩放 x 轴和数据

javascript - Yesod:在 AJAX 调用中使用类型安全的 URL

javascript - 从Javascript数组中删除带有字符的字符串

javascript - d3 "end-of-ticking"强制布局事件

javascript - d3 处理图表中的鼠标事件

csv - 如何使用 dc.js 创建饼图

javascript - dc.js饼图图例溢出

javascript - Kyle Simpson在Functional-Light JavaScript中混淆了变量赋值var [key] =