Highcharts onReady событие?

Есть ли какое-либо событие onReady (или подобное) для HighCharts?

В настоящее время HighCharts предлагает только addSeries, click, load, redraw и selection для объекта диаграммы (http://www.highcharts.com/ref/#chart-events). По-видимому, load должен быть тем, который запускает событие "на графике готов", но это не так. Он запускает событие "при загрузке данных"

Вот пример, который у них есть для load: http://jsfiddle.net/hgbQm/

Ниже приведена модифицированная версия приведенного выше кода, который показывает, что chart не готов при запуске load: http://jsfiddle.net/QzKky/1/

Любая идея?

В качестве альтернативы мне нужно будет сделать отложенные звонки, но это будет так уродливо. Спасибо!

Ответ 1

Действительно, отложенный вызов - не очень хороший подход. Событие load работает правильно, но текущий график ссылается на ключевое слово this, т.е.

// create the chart
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        events: {
            load: function(event) {
                //When is chart ready?
                console.log(this); //this refers to the loaded chart.
            }
        }        
    },
    xAxis: {
    },

    series: [{
        animation: false,
        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]     
    }]
});

Демо

Надеюсь, что это поможет:)

Ответ 2

Конструктор Highcharts.Chart принимает аргумент обратного вызова, который называется "когда объект графика завершен, загрузка и рендеринг". Объект диаграммы передается в качестве аргумента для обратного вызова.

$("#the-chart").highcharts(options, function (chart) {
    alert("The chart is ready now");
    console.log("chart", chart);
});

Диаграмма (опции объекта, обратный вызов функции) Это конструктор для создания нового объекта диаграммы.

Параметры

  • опции: Объект
      Параметры диаграммы, как описано в разделе" Объект параметров "в меню слева.

  • callback: Функция
    Функция, выполняемая при завершении загрузки и рендеринга объекта диаграммы. В большинстве случаев диаграмма построена в одном потоке, но в Internet Explorer версии 8 или ранее диаграмма иногда инициируется до того, как документ готов, а в темах объект диаграммы не будет завершен сразу после вызова newchics.Chart(). Как следствие, код, который полагается на недавно построенный объект диаграммы, должен всегда запускаться в обратном вызове. Определение обработчика chart.event.load эквивалентно.

Возвращает

  • Диаграмма

Ответ 3

Это определенно менее элегантно, чем принятый ответ, но все еще отлично работает с несколькими строками кода. Суть в том, чтобы просто опросить все элементы HTML-контейнера диаграммы.

В приведенном ниже коде предполагается, что у вас есть один или несколько Highcharts, прикрепленных к элементам, имеющим class= "chart":

var chartsToLoad = [];

$('.chart').each(function(n,elem) {

    chartsToLoad[n] = window.setInterval(function() {

        if(typeof($(elem).highcharts()) !== 'undefined') {

            // It loaded now, go ahead...
            $(elem).highcharts().doSomeHighchartsStuffHere()

            // Permanently stop polling
            window.clearInterval(chartsToLoad[n]);
        }

  }, 100); // Check every 100ms


});