Question

你能看一下 this demo ，让我知道为什么我也无法设置另一方yAxis？

$(function () {
            $('#chart2').highcharts({
        chart: {
            type: 'column'
        },
         credits: {
            enabled: false
        },
            title: {
            text: 'The Chart Title Goes Here!',
              style: {
                color: '#5882FA',
                fontWeight: 'normal',
                fontSize: '11',
                marginBottom: '30'
            }
        },

        xAxis: {
            categories: ['Roads', 'Powerlines'],

        },
                  yAxis: [{ // Primary yAxis
                labels: {
                    format: '{value}°C',
                    style: {
                        color: Highcharts.getOptions().colors[1]
                    }
                },
                title: {
                    text: 'Temperature',
                    style: {
                        color: Highcharts.getOptions().colors[1]
                    }
                }
            }, { // Secondary yAxis
                title: {
                    text: 'Rainfall',
                    style: {
                        color: Highcharts.getOptions().colors[0]
                    }
                },
                labels: {
                    format: '{value} mm',
                    style: {
                        color: Highcharts.getOptions().colors[0]
                    }
                },
                opposite: true
            }],
        legend: {
        enabled: false
    },
         tooltip: {
            formatter: function() {
                return this.x +
                    ' is <b>'+ this.y +'</b>';
            }
        },

        series: [{
            data: [{
                name: 'Roads',

                y: 200
            }, {
                name: 'Powerlines',
                color: '#FF00FF',
                y: 50
            }]
        }]
    });
});

我在Highcharts API上找到了一些示例，我尝试在我的演示中关注它们但是它们没有用！

Highcharts : bar chart with multiple y axes

Answer 1

好吧，我认为你需要修复你的series对象。 this ：

怎么样？

series : [{
        data : [{
                name : 'Roads',

                y : 200
            }, {
                name : 'Powerlines',
                color : '#FF00FF',
                y : 50
            }
        ]
    },
    {
        yAxis : 1,
        data : [{
                name : 'Roads',

                y : 30
            }, {
                name : 'Powerlines',
                color : '#FF00FF',
                y : 10
            }
        ]
    }
]

您还需要将yAxis : 1添加为id到轴（您可以明确设置轴的 id 以确保）

Answer 2

我已使用您的代码更正了问题：DEMO

您必须分别为每个y轴传递系列数据：

series: [{
            name: 'Rainfall',
            type: 'column',
            yAxis: 1,
            data: [49.9, 71.5],
            tooltip: {
                valueSuffix: ' mm'
            }

        }, {
            name: 'Temperature',
            type: 'column',
            data: [7.0, 6.9],
            tooltip: {
                valueSuffix: ' °C'
            }
        }]

在Highcharts.js中设置两个yAxis的问题

2 个答案: