Ajax和Highcharts-显示'；装载'；在检索到数据之前，请填充图表

我有一些php脚本，通常需要很长时间来检索数据。因此，这会影响highcharts加载时间，因为当前代码只有在检索到所有数据后才会写入图表，因为highcharts代码只有在所有处理完成后才会回显

这会导致页面在检索数据之前基本上不显示任何内容。目标是立即加载highcharts，然后使用php脚本返回的数据写入序列

因此，我希望所有的图形都能立即加载，并在没有数据的情况下显示“加载”，然后在php脚本完成后，使用setData将数据传递给图形系列

我只是想知道是否有人有这样做的例子？我遇到的另一个问题是只能在$（document）.ready（function（）函数）中设置数据

作品：

中断：

---

非常感谢您的帮助。

您无法访问范围外的变量、将其移动到该范围内或使变量成为全局变量

• -范围内

• -全局变量

  var pipeline_by_sales_stage_highchart;
  $(document).ready(function () {
              pipeline_by_sales_stage_highchart = new Highcharts.Chart({
  });
  
  ...
  
  // somewhere:
  pipeline_by_sales_stage_highchart.series[0].setData(data);
  

---

不知道您是否仍在查找此信息，但要显示“加载”消息，可以使用图表上的“setLoading（）”方法

pipeline_by_sales_stage_highchart.setLoading("Loading...")

检查这把小提琴：

在这里查看我的答案：

---

总结：

使用空序列初始化图表，然后在循环中使用

addSeries

更新图表，如下所示：

this.dataFromApi.forEach(function(serie) { // for each row of data, add a series
  this.chart.addSeries(serie, false); // false is to prevent redrawing
}.bind(this));
this.chart.redraw(); // manually redraw
this.chart.hideLoading(); // stop loading if showLoading() was call before

---

jsFiddle here:

感谢您的回复Pawel。我尝试了您的全局变量示例，但是它在jsFiddle中似乎工作得很好，但是在我的机器上本地尝试时，对象超出了范围：“错误：类型错误：pipeline\u by\u sales\u stage\u highchart未定义”可能您有两次$（）.ready？确保变量是全局变量。例如，在Chrome open console中，键入pipeline_…highchart并查看是否定义了。JSFIDLE不包含setLoading（）