一个 y 轴 nvd3/d3 的变化范围答案

【问题标题】：Change range for one y axis nvd3/d3一个 y 轴 nvd3/d3 的变化范围
【发布时间】：2013-06-08 20:17:02
【问题描述】：

我目前正在使用 multiChart 模型，并且我有两个不同的 y 轴。我想更改两个轴，以便它们从 0 开始，因为目前它们从最小的 y 数据点开始。

我尝试过以下操作

chart.yAxis1
tickFormat(d3.format(',.f'))
.domain([0,max_y]);

但这似乎不起作用

和

.forceY ([0, max_y])

它告诉我没有 forceY 功能

有什么想法吗？

【问题讨论】：

【解决方案1】：

.domain([0, max_y]) 应该用于scale 对象，而不是axis object。

所以：

var yScale = d3.scale.linear().domain([0,max_y])
var yAxis  = d3.svg.axis().scale(yScale)

这应该有效；如果没有，您应该将您拥有的内容发布为jsfiddle。

【讨论】：

嘿，我的代码使用数据库中的数据点，所以我不确定如何向您展示我的图表。我试着做 var yscale1 = d3.scale.linear().domain([0,400000]);但我得到 Uncaught TypeError: Cannot call method 'linear' of undefined。我正在使用 nvd3 来制作我的图表，而不仅仅是 d3。
console.log(JSON.stringify(data)) -> 复制/粘贴

【解决方案2】：

您可以在 NVD3 中为折线图或条形图强制设置最小值和最大值，尝试如下：

chart.bars.forceY([0]);

chart.lines.forceY([0,100]);

【讨论】：

【解决方案3】：

我发现解决问题的唯一方法是在图表定义中添加 yDomain1 或 yDomain2

对于 nvd3：

var chart = nv.models.multiChart()
    .yDomain1([-20, 80]) 
    .yDomain2([-50, 200])

对于 nvd3 AngularJS：

$scope.dashOptions = {
    chart : {
        type : 'multiChart',
        yDomain1:[-20, 80],
        yDomain2:[-50, 100],

【讨论】：