使用滚动条的Highcharts多级向下钻取仅绘制部分列

时间:2017-01-04 19:47:27

标签: highcharts

我需要绘制一个包含多级下钻的图表。因为每个级别具有不同的列数,所以我将在钻取/钻取事件中更新x轴的最大值。然后我注意到,一些钻取图表搞砸了。酒吧只画顶部。例如,y = 3068。图表仅从1500到3068。底部被截断。

$(function () {

    // Create the chart
    Highcharts.chart('container', {
        chart: {
            type: 'column',
            events: {
                load: function (e) {
                     this.xAxis[0].update({ max: 5 }); 
                },
                drilldown: function (e) {
                    this.xAxis[0].update({ min: 0 });
                    this.yAxis[0].update({ min: 0 });
                    if (e.seriesOptions.data.length > 14)
                        this.xAxis[0].update({ max: 15 });
                    else {
                        this.xAxis[0].update({ max: e.seriesOptions.data.length - 1 });
                   }
                },
                drillup: function (e) {
                    this.xAxis[0].update({ min: 0 });
                    this.yAxis[0].update({ min: 0 });
                    if (e.seriesOptions.data.length > 14)
                        this.xAxis[0].update({ max: 15 });
                    else {
                        this.xAxis[0].update({ max: e.seriesOptions.data.length - 1 });
                    }
                }
             }
        },
        title: {
            text: 'Basic drilldown'
        },
        scrollbar: {
            enabled: true
        },
        xAxis: {
            type: 'category'
        },

        legend: {
            enabled: false
        },

        plotOptions: {
            series: {
                borderWidth: 0,
                dataLabels: {
                    enabled: true
                }
            }
        },

        series: [{
            name: 'Daily Data',
            colorByPoint: true,
            data: [{
                name: '11/14/2016',
                y: 5850,
                drilldown: '11/14/2016'
            }
            ]
        }],
        drilldown: {
            series: [{
                id: '11/14/2016',
                data: [
                    {name: 'Customer Advocacy',
                     y: 8,
                     drilldown: 'Customer Advocacy0'},
                    {name: 'General Information',
                     y: 3068,
                     drilldown: 'General Information0'},
                    {name: 'Surcharge',
                     y: 98,
                     drilldown: 'Surcharge0'},
                    {name: 'Suspension And Restoration',
                     y: 2676,
                     drilldown: 'Suspension And Restoration0'}  
                ]
            }, {
                id: 'Customer Advocacy0',
                data: [
                    ['Belinda Arduini',2],
                    ['Deann Avery',2],
                    ['Michele Rahilly',3],
                    ['Tonia Lacey',1]
                ]
            }, {
                id: 'General Information0',
                data: [
                    ['Alicia Richardson',44],
                    ['Angela Gash',86],
                    ['Angela Migliaccio',125],
                    ['Ashonti Sweat',178],
                    ['Ayesha Walker',119],
                    ['Brandon Steen',76],
                    ['Charesse Yarbrough',101],
                    ['Denise Davis',2],
                    ['Dominicia Brown',65],
                    ['Eldora Thompson',105],
                    ['Essie Davis',2],
                    ['Isa Martinez',17],
                    ['Joanne Hendricks',102],
                    ['Kenyell Kelley',149],
                    ['Kiara Watkins',93],
                    ['Kimberly Barlow',109],
                    ['Lee Palma',30],
                    ['Leslie Caceros',155],
                    ['Lisa Fischer',184],
                    ['Lisa Poliziana',139],
                    ['Malisa Stanisclaus',116],
                    ['Michael Carlisi',145],
                    ['Miguel Rivera',85],
                    ['Natacha Perez-Mendez',130],
                    ['Patricia Bell',119],
                    ['Sandra Buchanan',99],
                    ['Sharae Donalson',140],
                    ['Shawn Gribbin',120],
                    ['Tara Damico',233]
                ]
            },
            {
            id: 'Surcharge0',
                name: '11/14/2016:Surcharge',
                data: [
                    ['Ernestine Bunche',17],
                    ['Janice Avent',17],
                    ['Sabrina Moses',20],
                    ['Veronica Gibson',44]
                ]
            },
            {
                            id: 'Suspension And Restoration0',
                name: '11/14/2016:Suspension And Restoration',
                data: [
                    ['Angel Deleon',95],
                    ['Catherine Lynch',81],
                    ['Colby Tobin',212],
                    ['Coreena Contreras',158],
                    ['Crystal Marshall',83],
                    ['Dane Powell',144],
                    ['Darrell Jones',98],
                    ['Denise Campi',166],
                    ['Denise Manners',32],
                    ['Diane Koval',114],
                    ['Eugenia Kostis',24],
                    ['Jeanne Cheeseman',136],
                    ['Jennifer Hiel',167],
                    ['Jennifer Rodriguez',102],
                    ['Lasonda Swinney',83],
                    ['Latina Mason',53],
                    ['Sherry Tartaglia',254],
                    ['Susan Pasteur',43],
                    ['Tomeka Ramocan',49],
                    ['Tracey Green',155],
                    ['Tracy Paulin',111],
                    ['Tricia Palazzone',86],
                    ['Ursula Covington',55],
                    ['Virginia Dardis',175]
                ]
            }]
        }
    });
});

0 个答案:

没有答案