d3。js & nvd3。如何设置y轴范围。

I'm trying to set the y-axis range of the chart from 1-100.

我试图将图表的y轴范围从1到100。

Consulted the API documentation and found a possible solution with axis.tickValues as seen here https://github.com/mbostock/d3/wiki/SVG-Axes#wiki-tickValues

查阅了API文档并找到了与axis可能的解决方案。这里的tickValues是https://github.com/mbostock/d3/wiki/SVG-Axes#wiki-tickValues。

However, using the option does not work. Reading further down on the documentation page linked above under axis.tickSize, the following line was spotted

然而，使用此选项并不起作用。在axis下面链接的文档页面上进一步阅读。tickSize，下一行被发现。

The end ticks are determined by the associated scale's domain extent, and are part of the generated path domain rather than a tick line

结束计时是由关联的规模的域范围决定的，并且是生成的路径域的一部分，而不是一条刻度线。

So I take it setting the min and max of the range can't be done through the Axis option.

所以我把它设置为range的最小值和最大值不能通过Axis选项来完成。

Any ideas on where I can specify the range?

关于我可以在哪里指定范围的任何想法?

6 个解决方案

#1

Found a solution.

找到了一个解决方案。

Appending .forceY([0,100]) to the instantiation of the chart forces the axis to take on the range specified in the array.

将. forcey([0,100])添加到图表的实例化，使axis能够接受数组中指定的范围。

From the example here http://nvd3.org/livecode/#codemirrorNav

从这里的示例http://nvd3.org/livecode/#codemirrorNav。

Appending .forceY([0,100]) to the chart variable works.

将. forcey([0,100])添加到图表变量的工作中。

#2

As the name should suggest, this adds the values in the array to your y domain, it does not set the y domain to [0,100]. So if you set this to [0,100] and your data's domain is -10 to 110, the domain will be [-10,110].

顾名思义，它将数组中的值添加到y域，它不会将y域设置为[0,100]。因此，如果你将这个设置为[0,100]，而你的数据域是-10到110，域将是[-10,110]。

Now if you wanted the domain to be [0,100] even if your data is larger you can use chart.yDomain([0,100]) ... BUT usually you want your domain to include or your data, so I highly recommend using chart.forceY instead of chart.yDomain. As you'll see, one of the most common uses for forceY is forceY([0]) to make 0 always in the domain.

现在，如果您希望域是[0,100]，即使您的数据更大，您也可以使用chart.yDomain([0100])…但是通常您希望您的域包含或您的数据，因此我强烈推荐使用图表。forceY代替chart.yDomain。正如您将看到的，forceY最常见的用法之一是强制([0])在域中始终保持0。

Hope that helps you understand what the function is actually doing, and arboc7, this should explain why it doesn't work in making the range smaller than the data set's.

希望能帮助您理解函数的实际操作，以及arboc7，这应该可以解释为什么它不能使范围小于数据集的范围。

#3

For stacked area charts, .forceY([0,100]) does not work. Use instead .yDomain([0,100])

对于堆叠区域图表，. forcey([0,100])不工作。使用相反.yDomain([0100])

#4

If you mean setting the y-domain (the range of numbers that should be displayed) for stacked area charts, this works for me:

如果你的意思是将y域(应该显示的数字的范围)设置为堆叠的区域图表，这对我来说是有效的:

nv.models.stackedAreaChart()
  .x(function(d) {...})
  .y(function(d) {...})
  .yDomain([0, maxY])
...

#5

I have tried like:

我一直喜欢:

chart.forceY([DataMin, DataMax]);

Datamin and Datamax need to calcuate from array. Also inorder to adjust axis points dynamically when filter applies need to custom handle click events of filter like:

Datamin和Datamax需要从数组中计算。当过滤器应用需要自定义处理点击事件时，也可以动态调整轴点，例如:

$('g.nv-series').click(function() {
   //Calculate DataMin, DataMax from the data array                    
   chart.forceY([DataMin, DataMax]);                        
});

So graph will adjust each time filter applies.

因此，图形将调整每个时间过滤器的应用。

#6

I had a similar issue and resolved it by explicitly defining the domain in the yScale of the yAxis, i.e.

我有一个类似的问题，通过在yAxis的yScale中显式定义域来解决它。

var yscale = d3.scale.linear()
                     .domain([0,100])
                     .range([250, 0]);
var yAxis = d3.svg.axis()
                  .scale(yscale);

#1