20

数据:

nvd3TestData = [
      {
        values:[
          {x:"M",y:1},
          {x:"T",y:2},
          {x:"W",y:3},
          {x:"R",y:3},
          {x:"F",y:4},
          {x:"S",y:5},
          {x:"U",y:6}
        ],
        key:"Apples"
      },
      {
        values:[
          {x:"M",y:5},
          {x:"T",y:2},
          {x:"W",y:6},
          {x:"R",y:8},
          {x:"F",y:2},
          {x:"S",y:4},
          {x:"U",y:1}
        ],
        key:"Zebras"
      }
    ]

创建图表(从 angularjs 指令中提取):

nv.addGraph -> 图表 = nv.models.multiBarChart() .stacked(true) .showControls(false)

chart.xAxis
  .axisLabel(attrs.xAxisLabel)

chart.yAxis
  .axisLabel(attrs.yAxisLabel)
  .tickFormat(d3.format(',r'))


console.log element


d3.select(element[0].children[0])
  .datum(nvd3TestData)
  .call(chart)

nv.utils.windowResize(chart.update)

输出:

输出

预期输出将包含所有 7 个标签:MTWRFSU

4

2 回答 2

26

我查看了 nvd3.org 并找不到任何真正的文档,但检查了源代码,我发现https://github.com/novus/nvd3/blob/master/src/models/multiBarChart.js显示了一个布尔图表“reduceXTicks”的参数,带有注释,表明它会做你想做的事。我用其中一个示例图表进行了尝试,它奏效了。具体来说,我使用了:

chart
   .reduceXTicks(true)
于 2013-06-14T06:09:14.913 回答
2

没有适当的文档,但您可以实现它。只需将以下行添加到您的图表 reduceXTicks: false

休息会随之而来。谢谢

于 2017-04-27T17:58:04.967 回答