Zeile im Flot-Diagramm markieren

8

Ist es möglich, ein Liniendiagramm mit Flot zu markieren? Ich sehe nur Hervorhebung der Datenpunkte, aber nicht die Linien zwischen den Punkten.

Ich verwende den Code aus dem folgenden Beispiel .

%Vor%     
LuckyStrike 10.11.2011, 20:22
quelle

3 Antworten

2

Mit Blick auf die Quelle für Flot 0.7 gibt es keine Funktionalität zum Markieren von Zeilen.

Wenn Sie Flot erweitern möchten, um das zu tun, was Sie wollen ...

Flot hat einen Overlay-Canvas, mit dem Effekte wie Hervorhebungen erzeugt werden. Dies hat den verknüpften Kontext octx in der Quelle. Wenn Sie sich die Methode drawPointHighlight(series, point) ansehen, können Sie sehen, wie die Hervorhebung für Datenpunkte erfolgt. Sie könnten eine ähnliche Methode für Linien schreiben.

Die Funktion drawOverlay() iteriert über ein Array von hervorhebbaren Objekten - Sie möchten das erweitern, um auch "Linien" -Objekte zu behandeln.

Schließlich müssten Sie eine Methode zum Hinzufügen / Entfernen von Zeilen aus dem Array von hervorhebbaren Objekten schreiben, analog zu den vorhandenen Methoden highlight() und unhighlight() . Beachten Sie, dass diese Methoden mithilfe der folgenden Zeilen veröffentlicht werden:

%Vor%     
fuzic 24.07.2012, 02:47
quelle
0

Anstatt zu versuchen, ein bestimmtes Liniensegment (oder eine Gruppe von Datenpunkten innerhalb einer Serie) hervorzuheben, könnten Sie zwei verschiedene Serien (jeweils mit einer passenden Farbe) verwenden, um das zu tun, was Sie wollen?

Ich mache das mit Balkendiagrammen, um eine zusätzliche Dimension in der Grafik des Diagramms anzuzeigen, und es funktioniert ziemlich gut.

HINWEIS: Ich habe Flot hauptsächlich für Balkendiagramme verwendet. Wenn Sie also Ihre Reihenlinie für einen Nullwert auf die horizontale Achse absenken, müssen Sie möglicherweise jedes Mal eine separate Serie verwenden, wenn Sie die Farbe ändern möchten ( oder zurück wechseln).

    
Peter Bernier 25.07.2012 14:04
quelle
0

Am einfachsten ist es, das Ereignis "plothover" zu verwenden, um das Diagramm erneut zu rendern. Flot rendert extrem schnell, daher sollte kein Flimmern auftreten. Ich mache das momentan in einem Projekt und es funktioniert großartig.

Die Dokumentation zu den Ereignissen 'plothover' und 'plotclick' finden Sie hier: Ссылка

Eine undokumentierte Eigenschaft von flot besteht darin, dass Sie jedem Serienobjekt beliebige Schlüssel hinzufügen können, und diese Schlüssel stehen in den Event-Handlern 'plothover' und 'plotclick' zur Verfügung. In meinem Beispiel habe ich einen beliebigen Schlüssel mit dem Namen "Schlüssel" erstellt, Sie könnten "Etikett" verwenden, wenn Sie Etiketten verwenden.

Hier ist ein Beispiel:

%Vor%

Hinweis - dies funktioniert nur, wenn Sie den Mauszeiger über einen tatsächlichen Datenpunkt bewegen.

    
Robert Williams 02.02.2013 23:15
quelle

Tags und Links