【问题标题】:Multiple bar chart segments in d3.jsd3.js 中的多个条形图段
【发布时间】:2014-03-20 04:11:34
【问题描述】:

我目前正在查看此条形图示例。

http://jsfiddle.net/enigmarm/3HL4a/13/

在我自己的版本中,我一直使用 json 数组作为数据,并且结构如下。

[{"irish":"154187","non_irish":"309638","area":"Connacht"},
 {"irish":"588725","non_irish":"2182932","area":"Ireland"},
 {"irish":"180755","non_irish":"1017491","area":"Leinster"},
 {"irish":"189395","non_irish":"672660","area":"Munster"},
 {"irish":"64388","non_irish":"183143","area":"Ulster"}] 

我的问题是如何将 data.irish 和 data.non_irish 应用于“y”属性并为两者生成条,因为目前我无法弄清楚如何同时应用这两者,因为“y”属性只会占用一个在它的参数中。

var bar = svg.selectAll("rect")
      .data(data)
      .enter().append("g")
      .attr("class", "bar");

var bartwo =bar.append("rect")
      .attr("class", "bar")
      .style("fill", function(d,i) {
     return colours[i];
     })

      .attr("x", function(d,i) { return x(data[i].area); })
      .attr("y", function(d,i) { return y(data[i].irish); })
      .attr("width", barWidth)
      .attr("height", function(d,i) { return height - y(data[i].irish); })

任何帮助将不胜感激。

【问题讨论】:

  • 听起来像是分组或堆叠的条形图。如果是这样,请参阅此all-in-one example from the master
  • 我不确定是不是我希望非爱尔兰语数据栏位于说爱尔兰语的数据栏旁边。
  • 试试this
  • 我不认为堆叠条形图是我想要的,我只想让爱尔兰数据条和非爱尔兰数据条并排显示,这可能吗?

标签: javascript d3.js bar-chart


【解决方案1】:

此双条形图可能会对您有所帮助:http://nvd3.org/examples/multiBarHorizontal.html。它强调两个维度的对比以及一个维度上多个群体的比较(例如不同地区的爱尔兰人数量)。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-10-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多