Highcharts的Y轴边界忽略楼顶。

问题描述 投票:0回答:1

我正试图创建一个相当基本的图表,显示一些时间序列数据。这些数据有时是正值,有时是负值。我知道数据的极端值,所以我在y轴上设置了一个上限和下限,这样范围就会足够窄,从而最大限度地提高数据的分辨率。

然而,一旦我有一些范围很宽的数据(比如-20到1000),下限和上限的值就会消失,图表会把y轴的负边界吹成一个巨大的数字,从而消除了数据的大部分分辨率。我已经尝试了每一个我能想到的minmaxminRangeminPaddingsoftThresholdfloorceiling等组合,但当有负值时,我无法让y轴的最小边界坚持在-50。

JSFiddle在这里。https:/jsfiddle.nethx6gnw3j2。

Highcharts.chart('container', {
    yAxis: {
      floor: -50,
      ceiling: 1000,
      opposite: true,
    },
    series: [{ 
        //data: [-8.9, 10.5, 15.4, 12.2, 14.0, 17.0, 13.6, 7.5, 2.4, 9.1, 9.6, 5.4],
        //data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 999.6, 54.4],
        data: [-15.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 800.6, 54.4],
    }]
});

有了前两个注释出来的数据集,一切都能正常工作。当有负值但范围较窄时,y轴显示所有数据,且范围很窄。当没有负值数据时,y轴的最小边界是0,最大是1000。但只要有一个负值和一个大的正值(第三组数据),我最终的y轴边界是-500和1000。这绝对不是我想要的。

希望有人有秘诀可以让这个低边界保持约束。

谢谢!

highcharts
1个回答
1
投票

你正在努力的问题是与保持计算的 滴答间隔 这种类型的数据的constance。

看看如何与这个特殊的数据图表看起来像强制最小值为-50。https:/jsfiddle.netBlackLabel26fujcL7.. 使用 yAxis.tickPositions 功能打破了负责设置tickIntervals的逻辑。

yAxis: {
  tickPositions: [-50, 0, 250, 500, 750, 1000]
},

API。https:/api.Highcharts.comhighchartsyAxis.tickPositions。

我不知道这是否是一个让你满意的输出。另外,你可以使用tickPositioner回调来计算你需要的tickPositions或者增加tickAmount。

API: https:/api.highcharts.comhighchartsyAxis.tickPositioner。

API。https:/api.Highcharts.comhighchartsyAxis.tickAmount。


0
投票

一个简单的解决方法是增加 tickInterval: 100 到您的Y轴。

© www.soinside.com 2019 - 2024. All rights reserved.