Javascript 海图-两个Y轴，一个具有最大值

我对Highcharts有问题，我已经将右Y轴设置为min:0和max:100（它是%），但它不起作用，并且占125%。 怎么了

$（函数（）{
$（“#容器”）。高图({
图表：{
类型：“区域”
},
标题：{
文本：“”
},
颜色：['#c42525'，'#8bbc21']，
xAxis：{
类别：[
'07:00:00','07:15:00','07:30:00','07:45:00','08:00:00','08:15:00','08:30:00','08:45:00','09:00:00','09:15:00','09:30:00','09:45:00','10:00:00','10:15:00','10:30:00','10:45:00','11:00:00','11:15:00','11:30:00','11:45:00','12:00:00','12:15:00','12:30:00','12:45:00','13:00:00','13:15:00','13:30:00','13:45:00','14:00:00','14:15:00','14:30:00','14:45:00','15:00:00','15:15:00','15:30:00','15:45:00','16:00:00','16:15:00','16:30:00','16:45:00','17:00:00','17:15:00','17:30:00','17:45:00','18:00:00','18:15:00','18:30:00','18:45:00','19:00:00','19:15:00','19:30:00','19:45:00','20:00:00','20:15:00','20:30:00','20:45:00','21:00:00','21:15:00','21:30:00','21:45:00','22:00:00','22:15:00','22:30:00','22:45:00','23:00:00','23:15:00'
],
标签：{
步骤：4，
轮调：-45，
对齐：“右”，
风格：{
fontSize:'10px'，
fontFamily:“Verdana，无衬线”
}
}
},
yAxis:[{//主yAxis
标签：{
格式：“{value}”，
风格：{
颜色：“#89A54E”
}
},
标题：{
正文：“1”，
风格：{
颜色：“#89A54E”
}
}
}，{//次雅克西
分:0,，
最高：100，
标题：{
文本：“”，
风格：{
颜色：“#4572A7”
}
},
标签：{
格式：“{value}%”，
风格：{
颜色：“#4572A7”
}
},
相反：对
}],
学分：{
已启用：false
},
工具提示：{
pointFormat:“{series.name}在{point.x}中生成{point.y:，.0f}
弹头”
},
打印选项：{
面积：{
标记：{
启用：false，
符号：'圆'，
半径：2，
国家：{
悬停：{
已启用：true
}
}
}
}
},
系列：[{
名称：“1”，
数据：[
空，空，43000410003900037000，
35000, 33000, 31000, 29000, 27000, 25000, 
35000, 33000, 31000, 29000, 27000, 25000, 
24000, 23000, 22000, 21000, 20000,
空，空，43000410003900037000，
24000, 23000, 22000, 21000, 20000,
24000, 23000, 22000, 21000, 20000
]
}, {
名称：‘2’，
数据：[
1、空、空、空、空、1005、1436、2063、3057、461827387、29459、31056、31982、32040、26956、27912、28999、28965、27826、，
100, 1005, 1436, 2063, 3057, 4618,27387, 29459, 31056, 31982, 32040, 26956, 27912, 28999, 28965, 27826,
1000, 1005, 1436, 2063, 3057, 4618,27387, 29459, 31056, 31982, 32040, 26956, 27912, 28999, 28965, 27826
]
},
{
名称：'%1！'，
颜色：“#4572A7”，
类型：“样条线”，
亚克西斯:1,，
数据：[80,70,78,86,64,51,58,88,88100100,95,68,91,92,93,94,85100]
}
]
});
});

您遇到的问题是highcharts正在尝试对齐刻度。有两种方法可以处理当前数据集的此问题：

max: 100

更改为

max: 75

或者，您需要将alignTicks设置为false

chart: {
    type: 'area',
    alignTicks: false
}

我知道了。 解决此问题的更好方法是使用tickinterval

这是样品

$（函数（）{
$（“#容器”）。高图({
图表：{
类型：“区域”
},
标题：{
文本：“”
},
颜色：['#c42525'，'#8bbc21']，
xAxis：{
类别：[
'07:00:00','07:15:00','07:30:00','07:45:00','08:00:00','08:15:00','08:30:00','08:45:00','09:00:00','09:15:00','09:30:00','09:45:00','10:00:00','10:15:00','10:30:00','10:45:00','11:00:00','11:15:00','11:30:00','11:45:00','12:00:00','12:15:00','12:30:00','12:45:00','13:00:00','13:15:00','13:30:00','13:45:00','14:00:00','14:15:00','14:30:00','14:45:00','15:00:00','15:15:00','15:30:00','15:45:00','16:00:00','16:15:00','16:30:00','16:45:00','17:00:00','17:15:00','17:30:00','17:45:00','18:00:00','18:15:00','18:30:00','18:45:00','19:00:00','19:15:00','19:30:00','19:45:00','20:00:00','20:15:00','20:30:00','20:45:00','21:00:00','21:15:00','21:30:00','21:45:00','22:00:00','22:15:00','22:30:00','22:45:00','23:00:00','23:15:00'
],
标签：{
步骤：4，
轮调：-45，
对齐：“右”，
风格：{
fontSize:'10px'，
fontFamily:“Verdana，无衬线”
}
chart: {
    type: 'area',
    alignTicks: false
}

$(function () {
        $('#container').highcharts({
            chart: {
                type: 'area'
            },
            title: {
                text: ''
            },
            colors: ['#c42525','#8bbc21'],
            xAxis: {
                categories: [
                            '07:00:00','07:15:00','07:30:00','07:45:00','08:00:00','08:15:00','08:30:00','08:45:00','09:00:00','09:15:00','09:30:00','09:45:00','10:00:00','10:15:00','10:30:00','10:45:00','11:00:00','11:15:00','11:30:00','11:45:00','12:00:00','12:15:00','12:30:00','12:45:00','13:00:00','13:15:00','13:30:00','13:45:00','14:00:00','14:15:00','14:30:00','14:45:00','15:00:00','15:15:00','15:30:00','15:45:00','16:00:00','16:15:00','16:30:00','16:45:00','17:00:00','17:15:00','17:30:00','17:45:00','18:00:00','18:15:00','18:30:00','18:45:00','19:00:00','19:15:00','19:30:00','19:45:00','20:00:00','20:15:00','20:30:00','20:45:00','21:00:00','21:15:00','21:30:00','21:45:00','22:00:00','22:15:00','22:30:00','22:45:00','23:00:00','23:15:00'
                            ],
                labels: {
                    step: 4,
                    rotation: -45,
                    align: 'right',
                    style: {
                        fontSize: '10px',
                        fontFamily: 'Verdana, sans-serif'
                    }
                }
            },
            yAxis: [{ // Primary yAxis
                gridLineWidth: 1,
                tickInterval:10750, //get max value from highest area and divide it by 4
                labels: {
                    format: '{value}',
                    style: {
                        color: '#89A54E'
                    }
                },
                title: {
                    text: '1',
                    style: {
                        color: '#89A54E'
                    }
                }
            }, { // Secondary yAxis
                tickInterval:20, //set ticks to 20
                min: 0,
                max: 100,
                title: {
                    text: '%',
                    style: {
                        color: '#4572A7'
                    }
                },
                labels: {
                    format: '{value}%',
                    style: {
                        color: '#4572A7'
                    }
                },
                opposite: true
            }],
            credits: {
                enabled: false
            },
            tooltip: {
                pointFormat: '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
            },
            plotOptions: {
                area: {
                    marker: {
                        enabled: false,
                        symbol: 'circle',
                        radius: 2,
                        states: {
                            hover: {
                                enabled: true
                            }
                        }
                    }
                }
            },
            series: [{
                name: '1',
                data: [
                    null, null, 43000, 41000, 39000, 37000,
                    35000, 33000, 31000, 29000, 27000, 25000, 
                    35000, 33000, 31000, 29000, 27000, 25000, 
                    24000, 23000, 22000, 21000, 20000,
                    null, null, 43000, 41000, 39000, 37000,
                    24000, 23000, 22000, 21000, 20000,
                    24000, 23000, 22000, 21000, 20000
                    ]
            }, {
                name: '2',
                data: [
                    1, null, null, null, null, 1005, 1436, 2063, 3057, 4618,27387, 29459, 31056, 31982, 32040, 26956, 27912, 28999, 28965, 27826,
                    100, 1005, 1436, 2063, 3057, 4618,27387, 29459, 31056, 31982, 32040, 26956, 27912, 28999, 28965, 27826,
                    1000, 1005, 1436, 2063, 3057, 4618,27387, 29459, 31056, 31982, 32040, 26956, 27912, 28999, 28965, 27826
                    ]
            },
            {
                name: '%',
                color: '#4572A7',
                type: 'spline',
                yAxis: 1,
                data: [80,70,78,86,64,51,58,88,88,100,100,95,68,91,92,93,94,85,100]
            }
            ]
        });
    });

alignTicks: false (chart)
max:100 (on % axis)
gridLineWidth: 0 (on second Y axis)