使用 jQuery 从 XML 加载 Highcharts 系列答案

【问题标题】：Loading Highcharts series from XML using jQuery使用 jQuery 从 XML 加载 Highcharts 系列
【发布时间】：2012-09-14 20:47:53
【问题描述】：

我正在尝试使用 jQuery 从 xml 源填充 highchart 系列。 XML 文件是从 RRDTool 导出的，格式如下：

<data>
<row><t>1347559200</t><v>2.1600000000e+01</v></row>
<row><t>1347562800</t><v>2.1504694630e+01</v></row>
<row><t>1347566400</t><v>2.1278633024e+01</v></row>
.
.
.
</data>

我的方法是使用 jQuery 加载数据并将系列推送到图表：

$.ajax({
      type: "GET",
      url: "data/data.xml",
      dataType: "xml",
      success: function(xml) {
        var series = {  data: []
                    };

        $(xml).find("row").each(function()
        {
            var t = parseInt($(this).find("t").text())*1000
            var v = parseFloat($(this).find("v").text())
            series.data.push([t,v]);
        });
        options.series.push(series);
      }
  });

我最终得到以下错误：

解析y属性的非预期值NaN

我创建了一个 JSFiddle 来演示代码：http://jsfiddle.net/GN56f/

【问题讨论】：

+1 用于创建小提琴
您能否在填充数组后添加一个 console.log 语句并验证所有 v 标签都是数字的吗？
@Adrian 一个不能重现问题的小提琴是没用的
@Musa 是的，我尝试运行它，但是跨域请求存在问题。真是令人失望……

标签： javascript jquery xml highcharts

【解决方案1】：

除了跨域问题外，错误是由于绘图选项中存在现有的空系列。选项中的初始系列应设置为：

series: []

代替：

系列：[{ 名称：'温度'，数据： [] }]

随后对options.series.push(series); 的调用只是添加了一个新系列，而空的系列保持不变。

【讨论】：

【解决方案2】：

问题：

在声明options 和chart 之前忘记了var
在结束options 之后忘记了;
在传递给Highcharts 之前，您尝试过登录options 吗？您正在传递以下series。

这是预期的结果？我认为没有。

series: [{
    name: 'Temperature',
    data: []
}, {
    data: [// data from xml]
}]

你在完成请求之前创建图表，所以options.series.data.push不起作用，你必须使用setData动态更新，但是有一个问题，你不知道你的请求需要多长时间，所以我建议你在success 中创建图表。

尝试以下方法。

success: function(xml) {
    $('row', xml).each(function() {
        options.series.data.push([t,v]);
    });
    //@todo: declare chart as global before the ajax function
    chart = new Highcharts.Chart(options);
}

【讨论】：