2012-09-14 11 views
5

Ich versuche, eine Highchart-Serie von einer XML-Quelle mit jQuery bevölkern. Die XML-Datei ist ein Export von RRDTool und hat folgendes Format:Loading Highcharts-Serie von XML mit jQuery

<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> 

Mein Ansatz, die Daten mit jQuery und drücken Sie die Serie auf die Tabelle zu laden war:

$.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); 
     } 
    }); 

ich am Ende immer die folgende Fehlermeldung:

Unexpected value NaN parsing y attribute

habe ich eine JSFiddle den Code zu demonstrieren: http://jsfiddle.net/GN56f/

+0

+1 für eine Geige zu schaffen –

+0

Könnten Sie eine console.log Anweisung hinzufügen, nachdem Ihr Array gefüllt ist, und überprüfen, ob alle der v-Tags numerisch sind? – marteljn

+1

@Adrian eine Geige, die das Problem nicht reproduziert, ist nutzlos – Musa

Antwort

2

Abgesehen von dem domänenübergreifenden Problem liegt der Fehler daran, dass in den Plotoptionen eine leere Reihe vorhanden ist.

series: [] 

statt:

Serie: Die erste Reihe in den Optionen gesetzt werden sollte [{ Name: 'Temperatur', Daten: [] }]

Die nachfolgende Ein Anruf an options.series.push(series); fügt lediglich eine neue Serie hinzu, wobei die leere unverändert bleibt.

2

Probleme:

  • Sie vergessen var vor declare options und chart
  • ; nach Ende vergessen options
  • Hava Sie options vor den Ball zu Highcharts einzuloggen versucht? Sie übergeben die folgenden series.

Das ist das erwartete Ergebnis? Ich denke nicht.

series: [{ 
    name: 'Temperature', 
    data: [] 
}, { 
    data: [// data from xml] 
}] 
  • Sie erstellen das Diagramm vor der vollständigen die Anfrage, so options.series.data.push wird nicht funktionieren, müssen Sie setData verwenden, um dynamisch zu aktualisieren, aber es gibt ein Problem, Sie wissen nicht, wie lange die Anfrage Sie nehmen, also schlage ich vor, Sie erstellen das Diagramm innerhalb der success.

Versuchen Sie Folgendes.

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