简体   繁体   English

如何在Highcharts中设置多个y轴的间隔?

[英]How to set intervals for multiple y-axis in Highcharts?

I am using Highcharts for Area Chart and displaying 2 y-axis but unable to set different min, max and tick intervals for them. 我正在使用“区域图表”的Highcharts并显示2个y轴,但无法为它们设置不同的最小,最大和刻度间隔。

We need help in implementing multiple y axis with set values of min , max and tick intervals. 我们需要帮助以最小,最大和刻度间隔的设置值实现多个y轴。

We are using Highcharts for Area Chart with 2 Y axis one on left side of the chart and other on right side of the chart. 我们将Highcharts用于面积图,带有2个Y轴,一个在图表的左侧,另一个在图表的右侧。 On left side of Y Axis we need the tick interval to be of 5 which is currently being shown as 20. Whereas on the right side of Y axis we need the tick interval of 10 which is currently being shown as 20. Siimilarly the min and max values for both the Y axis needs to be different. 在Y轴的左侧,我们需要将刻度间隔设置为5,当前将其显示为20。而在Y轴的右侧,我们需要将刻度间隔设置为10,当前将其显示为20。两个Y轴的最大值需要不同。 How we can we implement this ? 我们如何实现呢?

Appreciate the help. 感谢帮助。

Below is my highcharts config: 以下是我的highcharts配置:

chart: {
    type: 'area',
},
title: {
    text: null
},
xAxis: {
    min: 0,
    max: 600,
    tickInterval: 50,
    title: {
        text: ""
    }
},  
yAxis: [{
    min: 10,
    max: 40,
    tickInterval: 5,
    title: {
        text: ''
    }
},{
    min: -30,
    max: 30,
    tickInterval: 10,
    title: {
        text: ''
    },
    opposite: true
}],
size: {
    width: 1050,
    height: 170
},
series: [{
    showInLegend : false,
    name: '',
    yAxis: 0,
    color: 'red',
    lineWidth: 1,
    data: [33.69, 33.68, 33.68, 33.68, 33.68, 33.86, 33.59, 33.96, 33.89, 33.98]
},{
    showInLegend : false,
    name: '',
    yAxis: 0,
    color: 'orange',
    lineWidth: 1,
    data: [21.71, 30.42, 30.42, 30.42, 30.42, 31.03, 21.63, 29.81, 30.92, 21.63]
},{
    showInLegend : false,
    name: '',
    yAxis: 1,
    color: 'black',
    lineWidth: 1,
    data: [-8.44, -8.65, -8.65, -8.65, -8.65, -8.68, -8.62, -8.77, -8.56, -8.73]

};

在此处输入图片说明

you will have to use 你将不得不使用

alignTicks: false

here is updated fiddle 这是更新的小提琴

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM