NVD3如何正确设置y比例？答案

【问题标题】：NVD3 how set y scale correctly?NVD3如何正确设置y比例？
【发布时间】：2014-04-01 18:34:53
【问题描述】：

我的累积折线图没有正确构建 yScale。

给定要构建图表的数据：

var data = [{
  key: "Page view",
  values: [
    ["2013-07-01 00:00:00", 1],
    ["2013-08-01 00:00:00", 17],
    ["2013-09-01 00:00:00", 5],
    ["2013-10-01 00:00:00", 13]
  ]
}];

应在 yScale 上显示 17 的最大值显示为 8，如您在此处看到的：

https://www.evernote.com/shard/s253/sh/35928a9c-f5bb-4862-a227-f86423e6dd8a/8745a2c6cb5571002b7ec33b5386172a

这是我的代码：

nv.addGraph(function () {
   var chart;
   chart = nv.models.cumulativeLineChart()
              .x(function(d) { return moment(d[0]) })
              .y(function(d) { return d[1] })
              .color(d3.scale.category10().range())
              .transitionDuration(300)
              .showControls(false);

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

   chart.xScale(d3.time.scale());
   d3.select('#chart svg')
      .datum(data)
      .call(chart);

   nv.utils.windowResize(chart.update);

   return chart;
});

https://gist.github.com/lemanchester/9919615

我试过用：

 chart.yScale().domain([0, 50]);

或/和

 chart.forceY ([0, 50])

【问题讨论】：

看起来累积折线图的默认值是将 Y 轴显示为百分比（或成比例）变化，而不是原始值。但是，这仍然没有意义，因为第二个数据点（从 1 到 17）的百分比变化应该是 x16，而不是 x8。他们似乎也在对域大小进行调整...我的建议：使用常规折线图，然后自己循环遍历数据数组以找出累积值。

标签： javascript d3.js nvd3.js

【解决方案1】：

问题解决了！

就是那个累积折线图，它必须在 Y 轴上从 0 开始

var data = [{
  key: "Page view",
  values: [
    ["2013-06-01 00:00:00", 0],
    ["2013-07-01 00:00:00", 1],
    ["2013-08-01 00:00:00", 17],
    ["2013-09-01 00:00:00", 5],
    ["2013-10-01 00:00:00", 13]
  ]
}];

如你所见：

https://www.evernote.com/shard/s253/sh/404834ae-1797-4d23-96bd-3f7e0674822e/ef09346d45af2b31cd122a2014c34377

PS。谢谢鲍勃

【讨论】：