码迷,mamicode.com
首页 > 其他好文 > 详细

highcharts柱状图(堆叠图与多个柱图)、条形图(堆叠图与多组条形)

时间:2014-11-25 18:54:11      阅读:808      评论:0      收藏:0      [点我收藏+]

标签:highcharts

利用highcharts的

series: {

                stacking: ‘normal‘

            }

进行区分。

$(function () {

    $(‘#container‘).highcharts({

        chart: {

            type: ‘bar‘

        },

        title: {

            text: ‘Stacked bar chart‘

        },

        xAxis: {

            categories: [‘Apples‘, ‘Oranges‘, ‘Pears‘, ‘Grapes‘, ‘Bananas‘]

        },

        yAxis: {

            min: 0,

            title: {

                text: ‘Total fruit consumption‘

            }

        },

        legend: {

            backgroundColor: ‘#FFFFFF‘,

            reversed: true

        },

        plotOptions: {

            series: {

                stacking: ‘normal‘

            }

        },

        series: [{

            name: ‘John‘,

            data: [5, 3, 4, 7, 2]

        }, {

            name: ‘Jane‘,

            data: [2, 2, 3, 2, 1]

        }, {

            name: ‘Joe‘,

            data: [3, 4, 4, 2, 5]

        }]

    });

});



highcharts柱状图(堆叠图与多个柱图)、条形图(堆叠图与多组条形)

标签:highcharts

原文地址:http://3292043.blog.51cto.com/3282043/1582411

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!