Wie kann ich mit d3.js Daten in meinem Diagramm schneller anzeigen?
In meinem Code lade ich einen JSON mit 508 Einträgen in einem Liniendiagramm. Dieser JSON enthält Daten, die von einigen Maschinen ausgegeben werden, und die Schlüssel sind die Namen der Maschinen.
Dies ist die Struktur meines JSON:
%Vor% Ich lese gerade die Daten mit Hilfe eines Counters namens cont , aber der Code, den ich benutze, dauert zu lange, um den Graphen zu zeichnen:
Wie Sie im obigen gif sehen können, benötigt mein Code zu lange, um alle Datenpunkte zu zeichnen. Ich möchte alle Datenelemente meines Datensatzes (in diesem Fall 508) ohne Verzögerung zeichnen, zum Beispiel:
%Vor% Dabei ist tick der Name der Funktion, die die Koordinaten zeichnen würde, ohne den Sinn der Animation zu verlieren.
Wie geht das?
Hier ist ein Link zu meinem Code:
1 Antwort
Es scheint mir, dass Ihr Problem darin besteht, dass der Graph synchron ist - "Dauer" wird sowohl für die Animation als auch für das Verschieben von Graphen verwendet. Im Wesentlichen wird eine Änderung der Dauer nichts nützen.
Sie können einen Zeitmultiplikator einführen. Versuchen Sie dann, die Dauer durch zwei zu dividieren und einen Multiplikator von 2 zu verwenden. Ihre tatsächliche Datendauer ist nun Dauer * timeMultiplier (Sie können die Namen ändern, um sie weniger verwirrend zu machen oder einen timeDivider in der Animation verwenden).
%Vor%Eine andere Sache, die Sie versuchen könnten, ist, die Punkte auf einmal hinzuzufügen, d. h. Sie überspringen die Verschiebung bei ungeraden Ticks und verschieben den doppelten Betrag bei geraden Ticks. Dies reduziert den Overhead auf Kosten der Animation ein bisschen jaggieriger (aber nicht sehr viel, weil es auch schneller spielt).
Tags und Links javascript d3.js