#Diagramm-Optionen

Konfigurieren Sie die Anzeige Ihrer Diagramme. Es werden zwei Modi unterstützt: Basic (visuell) und Custom (JS). Der Basic-Modus eignet sich ideal für schnelle Zuordnungen und gängige Eigenschaften; der Custom-Modus ist für komplexe Szenarien und erweiterte Anpassungen gedacht.

#Panel-Struktur

Tipps: Um die Konfiguration zu vereinfachen, können Sie andere Panels zunächst einklappen.

Oben befindet sich die Aktionsleiste. Modusauswahl:

• Basic: Visuelle Konfiguration. Wählen Sie einen Typ aus, schließen Sie die Feldzuordnung ab und passen Sie gängige Eigenschaften direkt über Schalter an.
• Custom: Schreiben Sie JS im Editor und geben Sie eine ECharts option zurück.

#Basic-Modus

#Diagrammtyp auswählen

• Unterstützt werden: Linien-, Flächen-, Säulen-, Balken-, Kreis-, Ring-, Trichter- und Streudiagramme usw.
• Die erforderlichen Felder können je nach Diagrammtyp variieren. Bestätigen Sie zunächst die Spaltennamen und -typen unter „Datenabfrage → Daten anzeigen“.

#Feldzuordnung

• Linien-/Flächen-/Säulen-/Balkendiagramm:
  • xField: Dimension (z. B. Datum, Kategorie, Region)
  • yField: Messwert (aggregierter numerischer Wert)
  • seriesField (optional): Reihengruppierung (für mehrere Linien/Gruppen)
• Kreis-/Ringdiagramm:
  • Category: Kategoriale Dimension
  • Value: Messwert
• Trichterdiagramm:
  • Category: Phase/Kategorie
  • Value: Wert (üblicherweise Anzahl oder Prozentsatz)
• Streudiagramm:
  • xField, yField: Zwei Messwerte oder Dimensionen für die Achsen

Weitere Optionen zur Diagrammkonfiguration finden Sie in der ECharts-Dokumentation: Achsen und Beispiele.

Hinweise:

• Überprüfen Sie die Zuordnung erneut, nachdem Sie Dimensionen oder Messwerte geändert haben, um leere oder falsch ausgerichtete Diagramme zu vermeiden.
• Kreis-/Ringdiagramme und Trichterdiagramme müssen eine Kombination aus „Kategorie + Wert“ bereitstellen.

#Häufig verwendete Eigenschaften

• Stapeln, Glätten (Linien-/Flächendiagramm)
• Beschriftungen, Tooltip (Hinweis), Legende
• Achsenbeschriftungsrotation, Trennlinien
• Radius und Innenradius von Kreis-/Ringdiagrammen, Sortierreihenfolge von Trichterdiagrammen

Empfehlungen:

• Verwenden Sie für Zeitreihen Linien-/Flächendiagramme mit moderater Glättung; für den Vergleich großer Kategorien Säulen-/Balkendiagramme.
• Bei dichten Daten müssen nicht alle Beschriftungen angezeigt werden, um Überschneidungen zu vermeiden.

#Custom-Modus

Dient zum Zurückgeben einer vollständigen ECharts option. Geeignet für erweiterte Anpassungen wie das Zusammenführen mehrerer Reihen, komplexe Tooltips und dynamische Stile. Empfohlene Vorgehensweise: Konsolidieren Sie Daten in dataset.source. Details finden Sie in der ECharts-Dokumentation: Dataset.

#Datenkontext

• ctx.data.objects: Array von Objekten (jede Zeile als Objekt, empfohlen)
• ctx.data.rows: 2D-Array (mit Kopfzeile)
• ctx.data.columns: 2D-Array, nach Spalten gruppiert

#Beispiel: Monatsbestellungen als Liniendiagramm

return {
  dataset: { source: ctx.data.objects || [] },
  xAxis: { type: 'category' },
  yAxis: {},
  series: [
    {
      type: 'line',
      smooth: true,
      showSymbol: false,
    },
  ],
}

#Vorschau und Speichern

• Im Custom-Modus können Sie nach der Bearbeitung auf die Schaltfläche „Vorschau“ auf der rechten Seite klicken, um die Diagrammvorschau zu aktualisieren.
• Klicken Sie unten auf „Speichern“, um die Konfiguration anzuwenden und zu speichern; klicken Sie auf „Abbrechen“, um alle in dieser Sitzung vorgenommenen Änderungen rückgängig zu machen.

[!TIPP] Weitere Informationen zu Diagrammoptionen finden Sie unter Erweiterte Nutzung – Benutzerdefinierte Diagrammkonfiguration.