如何旋转我的HighCharts条形图使其垂直而不是水平?

Joh*_*rum 26 javascript highcharts

在此输入图像描述

$(document).ready(function() {
chart1 = new Highcharts.Chart({
    chart: {
        renderTo: 'QueryResultsChart',
        type: 'bar'
    },
    title: {
        text: 'Production History'
    },
    xAxis: {
        title: {
            text: 'Production Day'
        },
        type: 'datetime'
    },
    yAxis: {
        title: {
            text: 'Gross Production'
        }
    },
    series: [{
        name: 'Data',
        data: []
    }]
});
chart1.series[0].setData(". json_encode($aChartData) .");
});
Run Code Online (Sandbox Code Playgroud)

数据是正确的,它只是出于某种原因在yAxis上显示我的xAxis ...

Moi*_*man 52

column在Highchart 中称为V形条形图.

改变这个:

column

请参见此处的示例:http://jsfiddle.net/aznBb/


Ste*_*ntz 14

为了扩展Moin Zaman的答案,我和他的jsfiddle http://jsfiddle.net/aznBb/一起玩,并找到了这个.

这是横向的.

chart: {
    type: 'bar',
    inverted: false // default
}
Run Code Online (Sandbox Code Playgroud)

这也是横向的.

chart: {
    type: 'bar',
    inverted: true
}
Run Code Online (Sandbox Code Playgroud)

这是垂直的.

chart: {
    type: 'column',
    inverted: false // default
}
Run Code Online (Sandbox Code Playgroud)

这是水平的,显然与条形图相同.

chart: {
    type: 'column',
    inverted: true
}
Run Code Online (Sandbox Code Playgroud)

很奇怪.我只能猜测type: 'bar'别名type: 'column'和力量,inverted: true无论它实际上是什么.如果它只是切换inverted布尔值,那就太好了.