Big d3.js Graph, Canvas oder serverseitiges Rendering?

9

Ich benutze d3.js, um Zeitreihen-Daten zu visualisieren, die von meinem Python-Backend gesendet wurden (via Websocket). Die übliche Datenmenge für eine Grafik beträgt etwa 120 Einträge (2 Stunden Daten, 1 Eintrag pro Minute). Das läuft gut, wird jede Minute aktualisiert.

Aber es sollte auch in der Lage sein, Daten von einem Monat oder mehr (auch bis zu einem Jahr) zu visualisieren, auch in einem 1-Minuten-Intervall. Das Rendern einer solchen Datenmenge ist für SVG zu viel.

Ich denke an die folgenden Alternativen:

  • Rendering in einer Leinwand. Ist es wirklich so viel schneller?
  • Wechsel zu einer anderen Bibliothek wie Highchart.js (Sah eine Demo mit ~ 50k Einträgen)
  • Rendern des SVG / JPG / PNG auf dem Server. Erfahrung beim Rendern von d3.js serverseitig mit z. phantom.js? Ich würde gerne die bereits geschriebenen Graph-Modelle wiederverwenden. Es kann aber auch jede andere Bibliothek sein, die die Daten rendern kann (erzeugen Sie die Graphen mit Python)

Was würdest du empfehlen?

    
Beastcraft 01.07.2013, 17:11
quelle

1 Antwort

3

Beachten Sie, dass d3 die Verwendung von javascript gepufferten Arrays unterstützt. SVG-Plots mit Tausenden von Zeitreihendatenpunkten haben meiner Erfahrung nach gut funktioniert (sogar mit mehreren Quellen von Live-Daten-Streaming bei 20-ms-Updates über Websockets).

Zum Beispiel, wenn Sie alle Ihre Daten in Python packen; Sie müssen dies möglicherweise nicht in Ihrer Live-Ansicht tun, da Ihre Aktualisierungsrate relativ langsam ist:

%Vor%

Dann über Ihren Websocket, der zu Javascript kommt, wo Sie etwas tun können wie:

%Vor%

Und wenn Sie plotten wollen, nehmen wir an, dass g Ihr Bezug auf die D3 svg ist:

%Vor%

Natürlich sollte dies noch einfacher sein, wenn Sie alle Daten im Voraus haben. Planst du vielleicht Punkte anstatt eines einzelnen Pfades? Ich habe herausgefunden, dass Browser mit der Erstellung von Zehntausenden von einzelnen Kreisen kämpfen (vor allem wenn sie alle alle 20ms bewegt werden), aber sie können sehr einfach mit einem Pfad umgehen.

    
Hardbyte 30.07.2013 01:37
quelle

Tags und Links