Highcharts y轴刻度间隔

Question

我有一个折线图。数据始终以 100 为索引。我希望 yAxis 始终从 100 开始。我将 yAxis 设置为...

yAxis: {min: 0, tickinterval: 100}

确实将我的 yAxis 设置为 {0,100,200,---}。它确实适用于我的大部分数据，但是当数字很大时，tickinterval 会发生变化。它从 {0, 5k, 10k ...} 开始。我应该如何设置我的间隔，以便 100 在 yAxis 中始终可见？

Answer 1

我会使用第二个轴，并使用 tickPositions 属性。

此处示例：

• http://jsfiddle.net/jlbriggs/bxz6jdsw/

数字越大，100 将出现在刻度之间。 当刻度间隔为 100 时，第 2 轴的 100 会出现在主轴标签的前面，不被注意。

或者，您也可以将第二个 y 轴设置为相反，并且始终在右侧可见：

• http://jsfiddle.net/jlbriggs/bxz6jdsw/1/

您也可以忘记第二个 y 轴，而是使用带有标签的绘图线：

• http://jsfiddle.net/jlbriggs/bxz6jdsw/2/

如果这些示例都不适合您，您还可以查看tickPositioner 函数，看看您是否可以解决这个问题：

• http://api.highcharts.com/highcharts#yAxis.tickPositioner

Answer 2

将 yAxis 的 min 设置为 100 并将 startOnTick 设置为 false 将适用于从 100 显示该轴。为确保 100 的刻度可见，您可以使用 tickPositioner 并重新定义刻度的位置。

$(function () {
    $('#container').highcharts({
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },

        yAxis: {
            min: 100,
            startOnTick: false,
            tickPositioner: function() {
                var oldPos = this.tickPositions,
                    len = oldPos.length,
                    pos = [100],
                    i;
                for(i = 0; i<len; i++) {
                    if(oldPos[i] > 100) {
                        pos.push(oldPos[i]);
                    }
                }
                return pos;
            }
        },

        series: [{
            data: [200,400,300, 2000,2500,5000,60000,7e7] 
        }]
    });
});

示例：http://jsfiddle.net/w14kqf4d/

当使用大比例时，标签将被格式化为0.1k。要更改这一点，您可以使用标签的 format 或 formatter。

Answer 3

Here is a fiddle

yAxis: {
        min: 100,
    },