为 D3.js 图设置零基线

Question

我们有一个图表，当所有数据为零时，y 轴中间显示零美元值，下方显示一些负值。最好是底部有零，美元价值在一边。

这是图形代码：

nv.addGraph(function() {
    var chart = nv.models.multiBarChart()
      .transitionDuration(350)
      .reduceXTicks(false)
      .rotateLabels(0)
      .showControls(false)   //Allow user to switch between 'Grouped' and 'Stacked' mode.
      .groupSpacing(0.1)
      .tooltipContent(function (key, y, e, graph) {
          return '<p> Total Cost: $' + graph.value + '</p>';
      })
    ;

    chart.xAxis
        .tickFormat(function(d) { return d3.time.format('%b, %y')(new Date(d)); });

    chart.yAxis
        .tickFormat(function(d) { return '$' + d3.format(',f')(d) });
    d3.select('#hardware_costs_graph svg')
        .datum(exampleData())
        .call(chart);

    nv.utils.windowResize(chart.update);

    return chart;
  });

如何更改基线以不显示负值？

Answer 1

谢谢拉尔斯。我确实搜索了一段时间，但找不到它。

这里是任何需要它的人的解决方案。

在图表实例化中添加了 forceY：

var chart = nv.models.multiBarChart()
      .transitionDuration(350)
      .reduceXTicks(false)
      .rotateLabels(0)
      .showControls(false)   //Allow user to switch between 'Grouped' and 'Stacked' mode.
      .groupSpacing(0.1)
      .tooltipContent(function (key, y, e, graph) {
          return '<p> Total Cost: $' + graph.value + '</p>';
      })
      .forceY([0,5])
    ;