Chartjs v2 xAxes-Label überschneidet sich mit scaleLabel
Das Diagramm js v2 überschneidet sich mit einer Möglichkeit, den labelString von scaleLabel weiter nach unten zu verschieben, so dass es sich nicht überlappt. Bitte sehen Sie sich den Screenshot an, der im gelben und roten Teil markiert ist.
Ein Teil des Codes ist wie folgt
%Vor% 
1 Antwort
Es gibt zwei mögliche Lösungen für Ihr Problem:
1: Dies ist für ein Liniendiagramm, kann aber leicht auf ein Balkendiagramm zugeschnitten werden.
%Vor%Die Legende gehört zu den Standardoptionen der ChartJs-Bibliothek. Damit Sie müssen es nicht explizit als Option hinzufügen.
Die Bibliothek generiert den HTML-Code. Es ist nur eine Frage des Hinzufügens zu deiner Seite. Fügen Sie es zum Beispiel zu innerHTML eines bestimmten DIV hinzu. (Bearbeiten Sie die Standardoptionen, wenn Sie die Farben bearbeiten usw.)
2: Hinzufügen einer Legendenvorlage in den Diagrammoptionen
%Vor%Sie müssen auch einige grundlegende CSS hinzufügen, damit es in Ordnung aussieht.
Eine dieser beiden Optionen funktioniert.
In Ihrem Fall sieht der Legendencode ungefähr so aus
(Angenommen, Sie haben bereits ein BarChart generiert)
%Vor%Verwenden Sie dann css, um die Legende wie gewünscht zu formatieren (einschließlich des Abstands zwischen der Legende im Diagramm)
Tags und Links javascript canvas chart.js