Kategorien

← View All Tools

Gestapelter Flächendiagramm Generator

Gestapelte Flächendiagramme generieren, die kumulative Trends mehrerer Datenreihen zeigen, perfekt zur Visualisierung von Gesamttrends und Komponentenbeiträgen

Daten für das gestapelte Diagramm. Unterstützt Multi-Serie JSON für Stapelung oder Ein-Serie Array

Titel, der über dem Diagramm angezeigt wird

Farben für mehrere Flächen (Komma-getrennte Hex-Farben). Leer lassen für Standardfarben.

Deckkraft der Flächenfüllung (0.1 bis 1.0)

Hintergrundfarbe für den Diagramm-Container

Farbe für die Rasterlinien

Breite der Flächenbegrenzungslinien in Pixeln

Höhe des Diagramms in Pixeln

Maximalwert für Y-Achse (leer lassen für Auto-Skalierung)

Minimalwert für Y-Achse

Beschriftung für die X-Achse

Beschriftung für die Y-Achse

Rasterlinien für bessere Lesbarkeit anzeigen

Datenpunkte auf den Flächen anzeigen

Tatsächliche Werte auf Datenpunkten anzeigen

Linie anzeigen, die das kumulative Gesamtergebnis zeigt

Werte in Prozente umwandeln, die relativen Beitrag zeigen

Legende unter dem Diagramm anzeigen

Wichtige Fakten

Kategorie
Data Visualization
Eingabetypen
textarea, text, select, color, number, checkbox
Ausgabetyp
html
Sample-Abdeckung
4
API verfügbar
Yes

Überblick

Der Gestapelte Flächendiagramm Generator erstellt Diagramme, die kumulative Trends mehrerer Datenreihen visualisieren. Ideal für die Darstellung von Gesamttrends und dem Beitrag einzelner Komponenten über die Zeit.

Wann verwenden

  • •Wenn Sie die kumulative Entwicklung von Verkaufszahlen verschiedener Produkte über Monate darstellen möchten.
  • •Zur Visualisierung des Gesamtwachstums und der Anteile einzelner Abteilungen an einem Projekt.
  • •Um Trends in Umfragedaten zu zeigen, bei denen mehrere Kategorien gleichzeitig betrachtet werden.

So funktioniert es

  • •Geben Sie Ihre Daten im JSON-Format ein, entweder als Multi-Serie mit Labels und Serien oder als Ein-Serie Array.
  • •Passen Sie Diagrammoptionen wie Titel, Kurventyp, Farben und Achsenbeschriftungen an.
  • •Klicken Sie auf Generieren, um das gestapelte Flächendiagramm als HTML zu erhalten.
  • •Nutzen Sie zusätzliche Einstellungen wie Normalisierung auf 100% oder Anzeige einer Gesamtlinie.

Anwendungsfälle

Erstellung von Verkaufsberichten mit gestapelten Flächen für Produktkategorien.
Visualisierung von Ressourcenauslastung in Projektmanagement-Dashboards.
Darstellung von Umfrageergebnissen, um Trends in mehreren Antwortkategorien zu zeigen.

Beispiele

1. Monatliche Verkaufsanalyse

Hintergrund
Ein Verkaufsteam hat Daten zu den monatlichen Verkäufen von drei Produktlinien über ein Jahr.
Problem
Sie möchten den Gesamtumsatz und die Beiträge jeder Produktlinie über die Zeit visualisieren.
Verwendung
JSON-Daten mit Labels für Monate und Serien für jede Produktlinie eingeben, dann Diagrammoptionen anpassen.
Beispielkonfiguration
{
  "labels": ["Jan", "Feb", "Mär"],
  "series": [
    {"name": "Produkt A", "data": [100, 150, 120]},
    {"name": "Produkt B", "data": [80, 110, 140]},
    {"name": "Produkt C", "data": [50, 70, 90]}
  ]
}
Ergebnis
Ein gestapeltes Flächendiagramm zeigt den kumulativen Umsatz und wie jede Produktlinie zum Gesamtergebnis beiträgt.

2. Projektressourcen-Tracking

Hintergrund
Ein Projektmanager verfolgt die wöchentliche Arbeitsstunden-Aufteilung auf verschiedene Aufgaben.
Problem
Die Gesamtarbeitsstunden und der Anteil jeder Aufgabe sollen über Wochen dargestellt werden.
Verwendung
Daten als Multi-Serie JSON mit Wochen als Labels und Aufgaben als Serien eingeben, Kurventyp auf 'linear' setzen.
Ergebnis
Das Diagramm visualisiert die kumulative Arbeitsstunden-Verteilung und hilft bei der Ressourcenplanung.

Mit Samples testen

json
Grafana Fortgeschrittene Anwendungsbeispiele
Umfassende Grafana-Beispiele für fortgeschrittenes Dashboard-Design, Alerting-Konfiguration, Datenquellen-Integration und Plugin-Entwicklung
preferred input family json
json
D3.js Datenvisualisierung Beispiele
Umfassende D3.js datenvisualisierung beispiele einschließlich diagramme, karten, animationen und interaktive visualisierungen
preferred input family json
json
PDF-Beispiele
Generierte PDF-Beispiele von Tools zwischen 2026-02-01 und 2026-02-10
preferred input family json
json
WebRTC Echtzeitkommunikation Beispiele
Umfassende WebRTC-Beispiele für P2P Audio/Video-Kommunikation, Datenkanäle, Bildschirmfreigabe und Signalisierungsserver
preferred input family json
json

Verwandte Hubs

Json-Generate-Tools
Entdecken Sie 33 json-Tools für generate-Workflows und vergleichen Sie ähnliche Utilities schnell.
Json-Convert-Tools
Entdecken Sie 100 json-Tools für convert-Workflows und vergleichen Sie ähnliche Utilities schnell.
Json-Tools
Entdecken Sie 43 json-Tools für utility-Workflows und vergleichen Sie ähnliche Utilities schnell.
Json-Format-Tools
Entdecken Sie 6 json-Tools für format-Workflows und vergleichen Sie ähnliche Utilities schnell.

FAQ

Welches Datenformat wird unterstützt?

Das Tool unterstützt JSON-Daten, entweder als Multi-Serie mit Labels und Serien oder als Ein-Serie Array mit Label und Wert.

Kann ich die Farben der Flächen anpassen?

Ja, über die Option 'Flächenfarben' können Sie kommagetrennte Hex-Farben angeben.

Wie zeige ich die Gesamtlinie an?

Aktivieren Sie die Checkbox 'Gesamtlinie anzeigen' in den Optionen.

Ist eine Normalisierung der Daten möglich?

Ja, mit der Option 'Auf 100% normalisieren' können Sie Werte in Prozent umwandeln.

Welche Kurventypen sind verfügbar?

Sie können zwischen linear, glatt (gekrümmt) und Stufe (Treppe) wählen.

API-Dokumentation

Request-Endpunkt

POST /de/api/tools/stacked-area-chart

Request-Parameter

Parameter-Name Typ Erforderlich Beschreibung
chartData textarea Ja Daten für das gestapelte Diagramm. Unterstützt Multi-Serie JSON für Stapelung oder Ein-Serie Array
chartTitle text Nein Titel, der über dem Diagramm angezeigt wird
curveType select Nein -
areaColors text Nein Farben für mehrere Flächen (Komma-getrennte Hex-Farben). Leer lassen für Standardfarben.
fillOpacity text Nein Deckkraft der Flächenfüllung (0.1 bis 1.0)
backgroundColor color Nein Hintergrundfarbe für den Diagramm-Container
gridColor color Nein Farbe für die Rasterlinien
lineWidth number Nein Breite der Flächenbegrenzungslinien in Pixeln
chartHeight number Nein Höhe des Diagramms in Pixeln
maxValue number Nein Maximalwert für Y-Achse (leer lassen für Auto-Skalierung)
minValue number Nein Minimalwert für Y-Achse
xAxisLabel text Nein Beschriftung für die X-Achse
yAxisLabel text Nein Beschriftung für die Y-Achse
showGrid checkbox Nein Rasterlinien für bessere Lesbarkeit anzeigen
showPoints checkbox Nein Datenpunkte auf den Flächen anzeigen
showValues checkbox Nein Tatsächliche Werte auf Datenpunkten anzeigen
showTotalLine checkbox Nein Linie anzeigen, die das kumulative Gesamtergebnis zeigt
normalizeData checkbox Nein Werte in Prozente umwandeln, die relativen Beitrag zeigen
showLegend checkbox Nein Legende unter dem Diagramm anzeigen

Antwortformat

{
  "result": "
Processed HTML content
",
  "error": "Error message (optional)",
  "message": "Notification message (optional)",
  "metadata": {
    "key": "value"
  }
}
HTML: HTML

MCP-Dokumentation

Fügen Sie dieses Tool zu Ihrer MCP-Server-Konfiguration hinzu: 

{
  "mcpServers": {
    "elysiatools-stacked-area-chart": {
      "name": "stacked-area-chart",
      "description": "Gestapelte Flächendiagramme generieren, die kumulative Trends mehrerer Datenreihen zeigen, perfekt zur Visualisierung von Gesamttrends und Komponentenbeiträgen",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=stacked-area-chart",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Sie können mehrere Tools verketten, z.B.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, maximal 20 Tools.

Wenn Sie auf Probleme stoßen, kontaktieren Sie uns bitte bei [email protected]