javascript Highcharts 的 onReady 事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6979485/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Highcharts's onReady event?
提问by Lionel Chan
Is there any onReady(or similar) ready event for HighCharts?
onReadyHighCharts是否有任何（或类似的）就绪事件？
Currently, HighCharts only offers addSeries, click, load, redraw, and selectionfor chart object (http://www.highcharts.com/ref/#chart-events). Apparently the loadshould be the one which fires "on chart ready" event, but it's not. It's firing the event "when data is loaded"
目前，HighCharts只提供addSeries，click，load，redraw，和selection对于图表对象（http://www.highcharts.com/ref/#chart-events）。显然load应该是触发“on chart ready”事件的那个，但事实并非如此。它正在触发“加载数据时”事件
Here is a sample they have for load: http://jsfiddle.net/hgbQm/
这是他们的示例load：http: //jsfiddle.net/hgbQm/
Here is a modified version of the above code which shows the chartis not ready when loadis fired: http://jsfiddle.net/QzKky/1/
这是上述代码的修改版本，它显示了chart在load触发时未准备好：http: //jsfiddle.net/QzKky/1/
Any idea?
任何的想法？
Alternatively, I will need to do a delayed calls but that will be so ugly. Thanks!
或者，我需要进行延迟调用，但这会很丑陋。谢谢！
回答by stecb
Indeed the delayed call is not a very good approach. The loadevent is working properly, but the current chart is referred by the thiskeyword, i.e.
事实上，延迟调用并不是一个很好的方法。该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]
}]
});
Hope this helps :)
希望这可以帮助 ：）
回答by Jason Bright
The Highcharts.Chart constructortakes a callback argument that is called "when the chart object is finished loading and rendering". The chart object is passed as an argument to the callback.
该Highcharts.Chart构造采用的是被称为“当图表对象完成加载和渲染”一个回调参数。图表对象作为参数传递给回调。
$("#the-chart").highcharts(options, function (chart) {
alert("The chart is ready now");
console.log("chart", chart);
});
Chart(Object options, Function callback) This is the constructor for creating a new chart object.
Parameters
options: Object
The chart options, as documented under the heading "The options object"in the left menu.callback: Function
A function to execute when the chart object is finished loading and rendering. In most cases the chart is built in one thread, but in Internet Explorer version 8 or lessthe chart is sometimes initiated before the document is ready, and in thesecases the chart object will not be finished directly after callingnew Highcharts.Chart(). As a consequence, code that relies on the newly built Chart object should always run in the callback. Defining a chart.event.load handler is equivalent.Returns
- Chart
图表（对象选项，函数回调） 这是用于创建新图表对象的构造函数。
参数
选项：对象
图表选项，如左侧菜单中标题“选项对象”下所述。callback: Function
在图表对象完成加载和渲染时执行的函数。在大多数情况下，图表是在一个线程中构建的，但在 Internet Explorer 8 或更低版本中，图表有时会在文档准备好之前启动，在这些情况下，图表对象不会在调用 new Highcharts.Chart() 后直接完成。因此，依赖于新构建的 Chart 对象的代码应始终在回调中运行。定义一个 chart.event.load 处理程序是等效的。退货
- 图表
回答by Adam Friedman
This is definitely less elegant than the accepted answer, but still works fine with a few lines of code. The essence is to simply poll all chart container HTML elements.
这绝对没有公认的答案那么优雅，但使用几行代码仍然可以正常工作。本质是简单地轮询所有图表容器 HTML 元素。
The code below assumes you have one or more Highcharts attached to elements having class="chart":
下面的代码假设您有一个或多个 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
});
