Ich arbeite an der Erstellung eines einfachen Liniendiagramms mit Chart.js (2.0.2 Beta) und möchte einen bestimmten Bereich des Diagrammhintergrunds hervorheben, um einen "akzeptablen Bereich" hervorzuheben.
Hier ist ein Beispiel, was ich über Charts.js neu erstellen möchte: Beispiel für akzeptablen Bereich
Wenn es hilfreich ist, hier ist, was ich bis jetzt gearbeitet habe. Es ist ziemlich rudimentär. Jede Führung oder ein Anstupsen in die richtige Richtung wäre willkommen!
%Vor%Im Folgenden wird die erforderliche Funktionalität in Chart.js 2. * implementiert (verwendet Chart.js 2.1.4, die zum Zeitpunkt des Schreibens die aktuelle Version ist):
Die Implementierung basiert auf dem Erweitern des Liniendiagrammtyps und dem Überschreiben der draw -Funktion. Die neue Funktion draw prüft, ob innerhalb des data des Liniendiagramms das Folgende existiert, das den zu markierenden y-Bereich definiert:
Wenn es nicht existiert, wird die ursprüngliche Funktion draw aufgerufen. Wenn es existiert, wird ein Rechteck gezeichnet, das sich von links nach rechts und innerhalb des angegebenen y-Bereichs erstreckt. Nachdem das Rechteck gezeichnet wurde, wird die ursprüngliche Funktion draw aufgerufen, um die Zeichnung des Liniendiagramms zu vervollständigen.
Die erste Implementierung hat kein Rechteck gezeichnet. Unter anderem hatte es alle Pixelzeilen getrennt gezeichnet. Wie TV-Scanzeilen (ja, ich bin alt). Aber der alte Code ist hier (falls Sie sich für Strichzeichnung interessieren):
Der aktuelle Code lautet wie folgt:
Chart.js v2.0.2 bietet diese Funktionalität nicht standardmäßig.
Sie können jedoch neue Typkonstruktoren erweitern oder erstellen. Siehe Ссылка .
Sie sollten entweder einen Bereichstyp implementieren können, der durch zwei Linien begrenzt wird, oder Sie können einen Schwellenwertbereich ähnlich wie xnakos erstellen antworten.
Tags und Links javascript charts chart.js
