OnReady событие Highcharts?

Question

Существует ли какое-либо 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/

Любая идея?

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

Answer 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]     
    }]
});

Демо

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

Answer 2

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

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

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

Параметры

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

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

Возвращает

• Диаграмма

Answer 3

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

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

var chartsToLoad = [];

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

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

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

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

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

  }, 100); // Check every 100ms


});