HighCharts 轴在导出时翻转答案

【问题标题】：HighCharts axis flip on exportHighCharts 轴在导出时翻转
【发布时间】：2015-05-11 05:17:11
【问题描述】：

我的 Web 应用程序中有一个 Highchart。在浏览器中正常显示如下：

但是当我导出图表时，它会翻转轴，最终得到以下图像：

以下是我用于 Highchart 的选项。

var options = ({
        chart: {
            renderTo: 'chartDiv'
        },
        credits: {
            enabled: false
        },
        title: {
            text: ''
        },
        subtitle: {
            text: ''
        },
        xAxis: {
            type: 'datetime',
            tickInterval:  7200 * 10000,
            allowDecimals:false,
            labels: {
                format: '{value}',                   
                rotation: 30,
                align: 'left',                  
            },

            title: {
                text: 'Date'
            }
        },
        yAxis: [{
            title: {
                text: 'No. of rings'
            },
            min: 0
        },

        { // Secondary yAxis
            gridLineWidth: 0,
            min: 0,
            title: {
                text: 'Accumulative Rings',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
            labels: {
                format: '{value} Ring',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
            opposite: true,
        }

        ],
        tooltip: {
            shared: true
        },
        legend: { backgroundColor: 'rgba(211,223,181,0.6)', layout: 'vertical', align: 'left', verticalAlign: 'top', floating: true, borderWidth: 0, x: 70 },
        plotOptions: {
            spline: {
                marker: {
                    enabled: false
                },

            }               
        }
    });

我的图表中有三个系列，条形图可以有 0 个值。数据来自 ajax 服务，我将其放入数组中，然后添加到图表中，如下所示：

chart.addSeries({
    type: 'bar',
    name: 'Rings per day ',
    data: barData,
    pointInterval: mainInterval
});
chart.addSeries({

    type: 'spline',
    name: 'Accumilative rings ',
    data: spline1Data,
    yAxis: 1,
});
chart.addSeries({
    type: 'spline',
    name: 'Planned Progress ',
    data: spline2Data,
    yAxis: 1,
    color: "#FF0000"
});

我的图表有什么问题？

【问题讨论】：

提供现场演示会很好。你怎么试过exporting.chartOptionsapi.highcharts.com/highcharts#exporting.chartOptions？请记住，导出功能与图表本身不同。它可能有其他选项，有时默认情况下它已经有其他选项。就像条形图，其默认视图就像您提供的第二张图片一样。
bar 系列是关键部分。 bar 系列强制图表被翻转。在您的情况下使用column。它在您的浏览器上显示不同，很可能是因为您使用的是旧版本的 Highcharts。
感谢@PawełFus 这是解决方案，请添加为答案:)

标签： javascript jquery charts highcharts

【解决方案1】：

bar系列是关键部分。 bar 系列强制图表被翻转。在你的情况下使用column。它在您的浏览器上显示不同，很可能是因为您使用的是旧版本的 Highcharts。

【讨论】：