2016-12-08 2 views
0

Ich muss die letzte Kerze in meinem Diagramm aktualisieren. Normalerweise würde ich dies um einen Punkt zu aktualisieren verwenden:Aktualisierung der Highstock Chart Punkte

//javascript 
chart.series[0].data[n].update({...}); 

Allerdings ist mein series.data Array leer, wenn ich zeigen die gesamte möglicherweise Datensatz wegen:

Offizielle HighStock Dokumentation: Daten

Nur lesen. Ein Array mit den Datenpunktobjekten der Serie. Falls die Reihendatenlänge den cropThreshold überschreitet oder wenn die Daten gruppiert sind, enthält serial.data nicht alle Punkte. Es enthält nur die Punkte, die bei Bedarf erstellt wurden. In diesen Fällen können alle ursprünglichen X- und Y-Werte aus series.xData und series.yData gelesen werden. Darüber hinaus enthält series.options.data alle Konfigurationsobjekte für die Punkte, unabhängig davon, ob es sich um Zahlen, Arrays oder Objekte handelt. Array

Returns

Wie kann ich meine letzte Kerze Punkt aktualisieren, wenn die Schnittstelle zum Point.update Methode nur über das series.data Sammlung ist? Wenn mein series.data-Array leer ist, überschreibe ich einfach die Punkteigenschaften über series.options.data?

Ich habe auch überlegt, die series.update (options) -Methode aufzurufen, aber ich muss möglicherweise ein kerzenupdate viele Male als Ergebnis der Echtzeitaktivität durchführen. Daher wäre eine Aktualisierung des gesamten Serienobjekts aufgrund des Overheads keine gute Entscheidung.

Antwort

0

Das Datenarray ist leer, weil Highstock Datengruppierung durchführt - wenn es aktiviert ist, wird stattdessen das groupedData-Array verwendet. Leider können Sie einen gruppierten Punkt nicht aktualisieren (Highcharts löst den error).

Was Sie tun können, ist die Datengruppierung zu deaktivieren, dann werden Sie ein Datenfeld erhalten und point.update möglich ist oder verwenden Series.removePoint und Series.addPoint()

chart.series[0].removePoint([chart.series[0].groupedData.length - 1]); 
     chart.series[0].addPoint([ 
     Date.UTC(2016, 11, 8), 
     115, 
     2, 
     30, 
     20 
     ]); 

Beispiel: http://jsfiddle.net/0z95x58t/

Verwandte Themen