求助：Highcharts堆叠柱状图自定义刻度间隔设置

嗨，我来帮你搞定这个Y轴刻度的问题！你遇到的情况是Highcharts默认会根据数据范围自动计算刻度间隔，所以才会出现20的步长。要实现你想要的[0,50,60,70,…,200]这种特殊刻度，直接用tickPositions属性指定所有刻度位置就可以了，这是最直接有效的方法。

具体实现方法 #

你可以在Y轴的配置里直接手动列出所有需要显示的刻度值：

Highcharts.chart('container', {
    // 其他配置项（比如图表标题、系列数据等）...
    yAxis: {
        min: 0,
        max: 200,
        // 直接指定所有要显示的刻度位置
        tickPositions: [0, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150, 160, 170, 180, 190, 200],
        title: {
            text: '数值'
        },
        stackLabels: {
            enabled: true
        }
    }
});

如果觉得手动写数组太麻烦，也可以用代码动态生成这个刻度数组，这样后续调整范围时更灵活：

// 动态生成自定义刻度数组
const tickPositions = [0, 50];
for (let i = 60; i <= 200; i += 10) {
    tickPositions.push(i);
}

Highcharts.chart('container', {
    // 其他配置项...
    yAxis: {
        min: 0,
        max: 200,
        tickPositions: tickPositions,
        // 其他Y轴配置（比如标题、堆叠标签等）...
    },
    // 系列数据等其他配置...
});

注意事项 #

• tickPositions的优先级比自动计算的tickInterval更高，所以只要设置了这个属性，Highcharts就会严格按照你指定的刻度来渲染，不会再自动生成间隔。
• 确保不要保留会干扰刻度显示的属性（比如之前设置的tickInterval），避免出现冲突。

这样配置后，你的堆叠柱状图Y轴就会显示你想要的刻度啦！

内容的提问来源于stack exchange，提问作者user46663