Question

HighCharts是否有onReady（或类似的）就绪事件？

目前，HighCharts仅为图表对象（http://www.highcharts.com/ref/#chart-events）提供addSeries，click，load，redraw和selection。显然，load应该是在图表准备好的情况下触发＆＃34;＆＃34;事件，但事实并非如此。当数据加载＆＃34;

时，它会触发事件＆＃34;

以下是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]     
    }]
});

Demo

希望这会有所帮助：）

Answer 2

Highcharts.Chart constructor采用一个名为“当图表对象完成加载和渲染时”的回调参数。图表对象作为参数传递给回调。

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

图表（对象选项，函数回调）   这是用于创建新图表对象的构造函数。

参数



选项：对象
    图表选项，如左侧菜单中“选项对象”标题下所述。



回调：功能
  图表对象完成加载和渲染时执行的函数。在大多数情况下，图表是在一个线程中构建的，但在Internet Explorer版本8中，或者在文档准备好之前有时会启动图表，在这些情况下，在调用new 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


});

Highcharts的onReady活动？

3 个答案: