Highcharts лучший способ обновить динамически меняющиеся значения экспорта?

Question

У меня есть верхняя диаграмма сгруппированных столбцов с возможностью детализации. Это для школьного округа, так что мои сгруппированные столбцы - данные за предыдущий / текущий год для статистики уровня начальной, средней и старшей школы. Вы можете нажать на любой из столбцов, чтобы развернуть и посмотреть, как дела в отдельных школах. После экспорта диаграммы я пытаюсь внести несколько изменений в зависимости от того, какой школьный уровень был выбран - ширину и высоту диаграммы, категории по оси x и ротацию категорий.

Я надеялся, что смогу внести эти изменения динамически в разделе chart.events, но, похоже, он не работает. Я изначально мои динамические переменные вне первоначальной сборки диаграммы, и эти значения используются. Очевидно, я не делаю что-то правильно. Есть ли более простой способ обновить эти значения для метода экспорта, о котором я просто не знаю?

Я создал jsFiddle графика, чтобы вы могли видеть, что происходит ... любая помощь, которую вы можете оказать, как всегда, будет принята с благодарностью !!

cats = categoriesSL.slice();
categoryHeight = 300;
categoryWidth = 500;
categoryRotation = 0;

//Build The Chart
var refChart = new Highcharts.chart('ctReferrals', {
    chart: {
        backgroundColor: 'whiteSmoke',
        events: {
            drilldown: function () {
                categoryHeight = 400;
                categoryRotation = 90;

                switch (this.ddDupes[0]) {
                    case 'elem':
                    case 'elem2':
                        cats = categoriesElem.slice();
                        categoryCount = categoriesElem.length - 1;
                        categoryWidth = 6000;
                        refChart.xAxis[0].setCategories(categoriesElem);
                        break;
                    case 'mid':
                    case 'mid2':
                        cats = categoriesMid.slice();
                        categoryCount = categoriesMid.length - 1;
                        categoryWidth = 2500;
                        refChart.xAxis[0].setCategories(categoriesMid);
                        break;
                    case 'high':
                    case 'high2':
                        cats = categoriesHigh.slice();
                        categoryCount = categoriesHigh.length - 1;
                        categoryWidth = 2000;
                        refChart.xAxis[0].setCategories(categoriesHigh);
                        break;
                    default:
                        break;
                }

                refChart.xAxis[0].update({ max: 5 }, true);

                this.update({
                    scrollbar: {
                        enabled: true,
                    }
                }, false);
            },
            drillupall: function () {
                cats = categoriesSL.slice();
                categoryHeight = 300;
                categoryWidth = 500;
                categoryRotation = 0;
                categoryCount = categoriesSL.length - 1;

                refChart.xAxis[0].setCategories(categoriesSL);
                refChart.xAxis[0].update({ max: categoriesSL.length - 1 }, true);

                this.update({
                    scrollbar: {
                        enabled: false
                    }
                }, false);
            }
        },
        type: 'column',
    },
    title: {
        text: title
    },
    subtitle: {
        text: subTitle
    },
    xAxis: {
        categories: categoriesSL,
        min: 0,
        max: categoriesSL.length - 1,
    },
    yAxis: [{
        title: {
            useHtml: true,
            text: '<strong># Referrals</strong>'
        }
    }],
    tooltip: {
        shared: true,
    },
    plotOptions: {
        column: {
            borderRadius: 5,
            dataLabels: {
                enabled: true,
            },
        }
    },
    series: [{
        name: dataLabels[0],
        data: pySL
    }, {
        name: dataLabels[1],
        data: cySL
    }],
    drilldown: {
        allowPointDrilldown: false,
        series: [
            pyElem,
            cyElem,
            pyMid,
            cyMid,
            pyHigh,
            cyHigh
        ]
    },
    exporting: {
        chartOptions: {
            chart: {
                width: categoryHeight,
                height: categoryWidth,
            },
            xAxis: [{
                categories: cats,
                labels: {
                    rotation: categoryRotation
                },
                max: categoryCount,
            }]
        },
    },
    credits: {
        enabled: false
    }
})

Answer 1

Вчера я задал этот вопрос на доске сообщества highcharts, и кто-то ответил на него на этом вопросе ... в основном мне нужно было добавить .update () в раздел событий диаграммы. Я сделал это, и теперь все работает отлично !!

Вот ссылка на ответ и рабочий jsFiddle :