javascript 如何在 Highcharts 中为轴设置静态最小值
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8189921/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to set a static minimum value for axes in Highcharts
提问by David Murdoch
I have time-based data that ranges from 1 to 500. Time is plotted on the x axis and the values are on the y axis.
我有范围从 1 到 500 的基于时间的数据。时间绘制在 x 轴上,值绘制在 y 轴上。
When the range between the minimum and maximum data-points is great the y-axis' start label is 0. I can tell Highcharts not to display the label by setting yAxis.startOnTick = false;
but that's is not really what I'm after.
当最小和最大数据点之间的范围很大时,y 轴的起始标签为 0。我可以通过设置告诉 Highcharts 不要显示标签,yAxis.startOnTick = false;
但这并不是我真正想要的。
Here is a jsfiddleof the problem where you cannot tell if the first point is 0 or some other value. Having 0 here also looks like the min range for y is 0, not 1.
这是您无法判断第一点是 0 还是其他值的问题的 jsfiddle。这里的 0 看起来也像是 y 的最小范围是 0,而不是 1。
Can Highcharts display the first label and the first label should always be set to the minimum value in the dataset (relative to its axis).
Highcharts 能否显示第一个标签,并且第一个标签应始终设置为数据集中的最小值(相对于其轴)。
回答by Mark
I am amazed how difficult this is. Not an optimal solution, but the best I can dream upwith HighChart's api:
我很惊讶这是多么困难。不是最佳解决方案,但我可以用 HighChart 的 api想到最好的解决方案:
var someData = [1,5,82,9,300,5,42,199,5,6,99,1,56,52,250,64];
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
yAxis:{
min: -10,
tickInterval: 1,
labels: {
formatter: function() {
if (this.value < someData[0])
return null;
else if (this.value == someData[0])
return this.value;
else if (this.value % 50 == 0)
return this.value;
}
}
},
series: [{
data: someData
}]
});
回答by Halvor Holsten Strand
A solution (that optimizes Marks answer) is to use yAxis.labels.formatter
with this.isFirst
and this.axis.dataMin
, like this:
一个解决方案(优化Marks answer)是yAxis.labels.formatter
与this.isFirst
and一起使用this.axis.dataMin
,如下所示:
yAxis:{
labels: {
formatter: function() {
if(this.isFirst)
return this.axis.dataMin;
return this.value;
}
}
}
See this JSFiddle demofor an example.
有关示例,请参阅此 JSFiddle 演示。
The advantage of this is that you do not have to manually set tickInterval
, which saves a lot of calls to formatter
and lets Highcharts figure out the label intervals itself. Also, it uses the axis knowledge of the minimum data value, instead of having to check against an array (which you may have to iterate over to find the minimum).
这样做的好处是您不必手动设置tickInterval
,这样可以节省大量调用formatter
并让 Highcharts 自己计算标签间隔。此外,它使用最小数据值的轴知识,而不是必须检查数组(您可能必须迭代以找到最小值)。
Beware that the yAxis.min
must be set to something sensible here (works best with 0
, and positive data). If the y-axis goes far below the minimum datapoint the first label will not be the one at 0.
请注意,yAxis.min
必须在此处将 设置为合理的值(最适用于0
, 和正数据)。如果 y 轴远低于最小数据点,则第一个标签将不是 0 处的标签。
The this.axis
value was not available when this question was asked.
this.axis
询问此问题时,该值不可用。