awesome Download – awesome Quellcode-Download

awesome

Anderer Quellcode

1.0.0

Herunterladen

Tolles Chart.js

Eine kuratierte Liste toller Dinge im Zusammenhang mit Chart.js

Ressourcen
Diagramme
Plugins
Adapter
Integrationen
Werkzeuge

Chart.js-Unterstützung. Derzeit werden drei Hauptversionen von Chart.js verwendet. Bitte sehen Sie sich die Versionskennzeichen unten an, um zu überprüfen, ob eine Bibliothek Ihre Version von Chart.js unterstützt. (Außerdem bedeutet „❕“, dass eine Version nicht unterstützt wird.)

Chart.js v. 4️⃣ – veröffentlicht im November 2022
Chart.js v. 3️⃣ – veröffentlicht im April 2021
Chart.js v. 2️⃣ – veröffentlicht im April 2016

Ressourcen

Offizieller Leitfaden | Die Website mit Benutzerhandbüchern und Dokumentation.

Diagramme

Unterstützung	Name	Beschreibung
2️⃣ ❕ ❕	Bar-Trichter	Integriert den Diagrammtyp „Balkentrichter“.
2️⃣ 3️⃣ 4️⃣	Boxplot	Integriert den Diagrammtyp Boxplot und Violine
2️⃣ 3️⃣ 4️⃣	Fehlerbalken	Fügt verschiedene Fehlerbalkenvarianten von Standarddiagrammtypen hinzu
2️⃣ 3️⃣ ❕	finanziell	Fügt Finanzdiagrammtypen wie einen Candlestick hinzu
❕ 3️⃣ 4️⃣	Trichter	Fügt den Trichterdiagrammtyp hinzu
2️⃣ 3️⃣ 4️⃣	geo	Fügt geografische Kartendiagrammtypen wie Choroplethen- und Blasenkarte hinzu
2️⃣ 3️⃣ 4️⃣	Graph	Fügt Diagrammtypen wie ein kraftgerichtetes Diagramm hinzu
2️⃣ 3️⃣ 4️⃣	Matrix	Fügt den Matrixdiagrammtyp hinzu
2️⃣ 3️⃣ 4️⃣	PCP	Fügt den Diagrammtyp „Parallelkoordinaten“ hinzu
❕ 3️⃣ 4️⃣	sankey	Fügt den Diagrammtyp „Sankey-Diagramm“ hinzu
2️⃣ ❕ ❕	Schmied	Fügt den Diagrammtyp „Smith“ hinzu
2️⃣ 3️⃣ 4️⃣	gestapelt100	Zeichnet ein zu 100 % gestapeltes Balkendiagramm
2️⃣ 3️⃣ 4️⃣	Baumkarte	Fügt den Diagrammtyp „Treemap“ hinzu
❕ 3️⃣ 4️⃣	venn	Fügt den Venn- und Euler-Diagrammtyp hinzu
❕ 3️⃣ 4️⃣	Wortwolke	Integriert den Diagrammtyp „Wortwolke“.

Plugins

Styling

Unterstützung	Name	Beschreibung
❕ 3️⃣ 4️⃣	Autofarben	Automatische Farbgenerierung
2️⃣ ❕ ❕	Farbschemata	Ermöglicht die automatische Farbgebung mithilfe vordefinierter Farbschemata
❕ 3️⃣ 4️⃣	Gradient	Einfache Steigungen
2️⃣ ❕ ❕	rauh	Zeichnet Diagramme in einem skizzenhaften, handgezeichneten Stil mit Rough.js
2️⃣ ❕ ❕	Stil	Bietet Styling-Optionen wie Schatten-, Abschrägungs-, Glüh- oder Überlagerungseffekte
❕ ❕ 4️⃣	Zeitstapel	Fügt eine eigenwillige Zeitskalenformatierung mit „schönen“ Zeiteinteilungen hinzu

Merkmale

Unterstützung	Name	Beschreibung
2️⃣ 3️⃣ 4️⃣	Anmerkung	Zeichnet Linien, Kästchen, Punkte, Beschriftungen, Polygone und Ellipsen im Diagrammbereich
2️⃣ 3️⃣ ❕	Fadenkreuz	Fügt Linien- und Streudiagrammen ein Datenfadenkreuz hinzu
2️⃣ 3️⃣ 4️⃣	Datenetiketten	Zeigt Beschriftungen für Daten aller Diagrammtypen an
2️⃣ ❕ ❕	Donutetikett	Zeigen Sie eine Textbeschriftung in der Mitte eines Ringdiagramms an
2️⃣ 3️⃣ 4️⃣	hierarchisch	Fügt hierarchische Skalen hinzu, die reduziert, erweitert und fokussiert werden können
❕ ❕ 4️⃣	Bildetikett	Zeigt Bildbeschriftungen für Daten für Donut-Diagramme an
2️⃣ ❕ ❕	Kreisdiagramm-Outlabels	Zeigt Beschriftungen außerhalb eines Kreis-/Donut-Diagramms an
2️⃣ ❕ ❕	Rückschritt	Berechnen und zeichnen Sie statistische Regressionen (Trendlinien)
❕ ❕ 4️⃣	Trendlinie	Zeichnen Sie Trendlinien
2️⃣ ❕ ❕	Wasserfall	Ermöglicht die einfache Verwendung von Wasserfalldiagrammen

Interaktionen

Unterstützung	Name	Beschreibung
❕ ❕ 4️⃣	a11y-legende	Bietet Tastaturzugriff für Diagrammlegenden
❕ 3️⃣ 4️⃣	chart2music	Verbessert die Zugänglichkeit von Diagrammen durch Tastaturnavigation und Sonifikation
2️⃣ 3️⃣ 4️⃣	aufgeschoben	Verschiebt die erste Aktualisierung des Diagramms, bis das Diagramm in das Ansichtsfenster gescrollt wird
2️⃣ 3️⃣ 4️⃣	Dragdata	Ermöglicht Benutzern das Ziehen von Datenpunkten im Diagramm
2️⃣ 3️⃣ 4️⃣	Zoom	Ermöglicht das Zoomen und Schwenken in Diagrammen

Datenquellen

Unterstützung	Name	Beschreibung
2️⃣ 3️⃣ 4️⃣	Datenquelle-Prometheus	Zeigt Zeitreihen von Prometheus an
2️⃣ 3️⃣ ❕	Streaming	Fügt Unterstützung für Live-Streaming-Daten hinzu

Darüber hinaus sind viele Plugins in der npm-Registrierung zu finden.

Adapter

Unterstützung	Name	Beschreibung
2️⃣ 3️⃣ 4️⃣	date-fns	Datum-FNS-Adapter
2️⃣ 3️⃣ 4️⃣	dayjs	DayJS-Adapter
2️⃣ 3️⃣ 4️⃣	Luxon	Luxon-Adapter
2️⃣ 3️⃣ 4️⃣	Moment	Moment.js-Adapter
❕ 3️⃣ 4️⃣	Raumzeit	Raumzeit-Adapter

Integrationen

JavaScript

Unterstützung	Name	Beschreibung
2️⃣ ❕ ❕	Ember-Cli-Chart	Ember-CLI
❕ ❕ 4️⃣	fresh_charts	Frisch
2️⃣ ❕ ❕	lwcc	Lightning-Webkomponente
2️⃣ 3️⃣ 4️⃣	ng2-Charts	Angular v2+
2️⃣ 3️⃣ ❕	Omi-Diagramm	Omi
2️⃣ 3️⃣ 4️⃣	reagieren-chartjs-2	Reagieren
❕ 3️⃣ 4️⃣	solide-chartjs	SolidJs
❕ 3️⃣ 4️⃣	schlanke-chartjs	Schlank
2️⃣ 3️⃣ 4️⃣	vue-chartjs	Vue.js

Andere

Unterstützung	Name	Beschreibung
❕ 3️⃣ ❕	BlazorChartjs	Blazor
❕ 3️⃣ 4️⃣	pax.BlazorChartJs	Blazor (mit JavaScript-Isolation)
2️⃣ 3️⃣ 4️⃣	Charba	GWT/J2CL
2️⃣ ❕ ❕	chart.java	Java
❕ ❕ 4️⃣	chartjs-Java-Modell	Java
2️⃣ ❕ ❕	chartjs-ocaml	OCaml
2️⃣ 3️⃣ ❕	chartjs-ror	Ruby vereinfacht die Verwendung von Chart.js in Rails-Ansichten
❕ 3️⃣ 4️⃣	chart-js-rs	Chart.js-Typen-API in Rust (WIP in Alpha/unvollständig)
2️⃣ ❕ ❕	django-chartjs	Django
	figma	Designkomponenten
2️⃣ 3️⃣ 4️⃣	ipychart	Python
2️⃣ 3️⃣ 4️⃣	laravel-chartjs	Laravel
2️⃣ ❕ ❕	verflüssigen	Schnelle Multithread-Visualisierung von Stream-Daten mit Angular
2️⃣ ❕ ❕	nova-chartjs	Laravel Nova
2️⃣ 3️⃣ 4️⃣	Quickchart	Web-API für statische Diagramme
2️⃣ ❕ ❕	Wicked-Charts	Wrapper für Java-Webanwendungen
❕ 3️⃣ ❕	symfony/ux-chartjs	Symfony UX-Paket