Обработчик событий Highcharts после завершения перерисовки

Question

Я пытаюсь показать сумму по оси Y в качестве субтитра для диаграммы HighStock. Первоначально это достигается путем суммирования значения point.y всех рядов внутри события «load» следующим образом:

chart: {
    events: {
        load: function () {
            var chart = this,
                series = chart.series,
                seriesSum = 0;
            series.forEach(function (series) {
                series.data.forEach(function (point) {
                    seriesSum += point.y
                })
            })
            this.update({
                subtitle: { text: 'TOTAL:  ' + seriesSum }
            });
        },
    }
}

Теперь мне нужно обновить ОБЩУЮ сумму после того, как график был перерисован после изменения таймфрейма с помощью либо навигатора, либо селектора диапазона. Я знаю, что есть событие «перерисовки», но это приведет меня к бесконечному циклу. К какому событию я должен быть привязан?

Answer 1

Вы можете использовать метод update с флагом redraw в событии redraw, но вы должны установить правильные условия, чтобы не попасть в бесконечный цикл:

var redrawEnabled = true;

var chart = Highcharts.chart('container', {
    chart: {
        zoomType: 'x',
        events: {
            redraw: function() {
                if (redrawEnabled) {
                    var sum = 0;
                    redrawEnabled = false;

                    Highcharts.each(this.series[0].points, function(point) {
                        if (point.isInside) {
                            sum += point.y;
                        }
                    });

                    this.update({
                        subtitle: {
                            text: sum
                        }
                    });

                    redrawEnabled = true;
                }
            }
        }
    },
    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]
});

Демонстрация в реальном времени: http://jsfiddle.net/BlackLabel/dewumkz6/

Answer 2

Вы можете использовать событие redraw и просто не перерисовывать в ожидающем перерисовке.Например:

chart: {
    events: {
        redraw: function () {
            this.update({
                subtitle: { text: 'TOTAL:  ' + seriesSum }
            }, false);
        }
    }
}

Запишите параметр false для функции Chart.update, чтобы предотвратить дальнейшее перерисовывание (бесконечный цикл).

См. thisДемонстрация JSFiddle с использованием Highcharts и события redraw.