NVD3 中 Grouped/Stacked 条形图的文本轴标签

Question

我一直在尝试让 x 轴显示文本轴标签。示例在这里 https://jsfiddle.net/z4aZ4/859/ 我想要 "Question 1" 显示在 x 轴上。目前显示"Nan"。

var data = 
[
{
"key": "Yes",
"color": "#d67777",
"values": [
  {
    "x" : "Question 1" ,
    "y" : 70
  } ,
  {
    "x" : "Question 2" ,
    "y" : 65
  } 
    ]
  },
  {
"key": "No",
"color": "#4f99b4",
"values": [
  {
    "x" : "Question 1" ,
    "y" : 30
  } ,
  {
    "x" : "Question 2" ,
    "y" : 35
  } 
    ]
  }
]

Answer 1

您必须更改刻度格式才能加载标签。在 addGraph 函数上：

替换

.tickFormat(d3.format(',f'));

有

.tickFormat(function(d) { return d; });

此外，要为每一列显示一个标签，您必须将 reduceXTicks 设置为 False：

var chart = nv.models.multiBarChart()
.reduceXTicks(false);

NVD3 中 Grouped/Stacked 条形图的文本轴标签

Text Axis Labels for Grouped/Stacked Bar chart in NVD3

nvd3.js