Question

我想创建一个包含不同系列数据的图表。我有几个问题的民意调查，每个问题都有不同的选择。我试着使用这段代码：

$(function () {
$('#c_chart').highcharts({
    chart: {
        type: 'column'
    },
    xAxis: {
        categories: [
            'Question 1',
            'Question 2',
        ],
        crosshair: true
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Rainfall (mm)'
        }
    },
    tooltip: {
        headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
        pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
            '<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
        footerFormat: '</table>',
        shared: true,
        useHTML: true
    },
    plotOptions: {
        column: {
            pointPadding: 0.2,
            borderWidth: 0
        }
    },
    series: [{
        name: [['Option1', 'Option2']],
        data: [49.9, 56]

    }, {
        name: 'Option3',
        data: [83.6]

    }
    ]

});});

如何创建此图表，如下图所示：

Chart

Answer 1

我的英语基本但是，我试图摒弃过程？

尝试查看此链接，我不太确定您是否需要在plotOptions中移动内容：{}或图表：{}

其他选项不绘制图表。我找到了这个链接，我希望能帮到你

http://www.highcharts.com/docs/chart-design-and-style/design-and-style

http://api.highcharts.com/highcharts#plotOptions.bar.dataLabels

grettins，来自墨西哥：）

Answer 2

$(function () {
$('#container').highcharts({

    chart: {
        type: 'column'
    },

    title: {
        text: 'Questions Answers'
    },

    xAxis: {
        categories: ['Question1', 'Question2', 'Question3', 'Question4', 'Question5']
    },

    yAxis: {
        allowDecimals: false,
        min: 0,
        title: {
            text: 'Option Ticked'
        }
    },

    tooltip: {
        formatter: function () {
            return '<b>' + this.x + '</b><br/>' +
                this.series.name + ': ' + this.y + '<br/>';
        }
    },

    plotOptions: {
        column: {
            stacking: false
        }
    },

    series: [{
        name: 'Option1',
        data: [5, 3, 4, 7, 2]
    }, {
        name: 'Option2',
        data: [3, 4, 4, 2, 5]
    }, {
        name: 'Option3',
        data: [2, 5, 6, 2, 1]
    }, {
        name: 'Option4',
        data: [3, 0, 4, 4, 3]
    }]
});

}）;

具有不同系列数据的高图表

2 个答案: