Chart.js - Hinzufügen eines Farbverlaufs statt einer Volltonfarbe - Implementierung der Lösung

9

Ich verwende Chart.js und alles ist in Ordnung, aber ich möchte den aktuellen Farbhintergrund (fillColor: "rgba (250,174,50,0.5)") durch einen Farbverlauf ersetzen. Ich habe eine Lösung, um den Gradienten zu ersetzen, aber es ist zu schwierig für mich, dies mit meinem schlechten JS-Wissen umzusetzen. Ich denke ziemlich einfach für jemanden, der JS kennt.

Also mein Chart.js-Code:

%Vor%

Und hier ist eine Lösung mit Farbverlauf . Kann jemand versucht diesen Gradientenhintergrund anstelle meines gegenwärtigen festen Hintergrundes zu implementieren? Danke für die Hilfe.

Ich habe versucht, es zu implementieren, aber andere Funktionen funktionieren nicht (wie scaleLabels etc.).

    
John Cavalier 04.04.2015, 14:28
quelle

2 Antworten

21

Der Link, den Sie angegeben haben, war ziemlich klar. Sie müssen das Feld fillColor in Datasets ein linearGradient-Objekt anstelle einer einfachen Farbe einfügen. Sie können komplexe Gradienten machen, aber hier ist der Code eines einfachen (Ändern der Deckkraft der gleichen Orange):

%Vor%

Und Ihre vollständigen Datensätze:

%Vor%

Sehen Sie es in Aktion in diesem JSFiddle

    
bviale 07.05.2015 13:06
quelle
5

Hinweis: Wenn Sie eine neuere Version (v2.7.0) von Chart.js verwenden, stellen Sie fest, dass sie nicht funktioniert, während Sie die @ bviale-Antwort auf die Codebasis kopieren. Einige Eigenschaftsnamen haben sich geändert:

%Vor%

Sie müssen diese Eigenschaftsnamen aktualisieren, damit es funktioniert.

Referenz: Ссылка

    
AJ Hsu 11.10.2017 04:40
quelle

Tags und Links