Datenvisualisierung
      Zurück zur Startseite
      1. Knowledge Base
      2. Komponenten & Funktionalitäten
      3. Datenvisualisierung

      Charts

      Über die Komponenten Chart können Sie Daten in unterschiedlichsten Formen visualiseren - z.B. über ein Balken-, Linien-, Flächen-, Punkte-/Wolken-, Blasen- oder Rangediagramme

      In diesem Artikel lesen Sie folgende Inhalte:

      Chart Properties

      Chart Funktionalitäten

      TD_FT_Charts

      Tipp! Hier sehen Sie mehr von der Komponente.

      In dem Artikel "Datenvisualisierung über Charts" lesen Sie, wie sie über verschiedenste Chart-Typen Daten aus der Datenbank direkt visualisieren & aufbereiten können.

      1. Chart Properties

      Properties

      Beschreibung

      ID

      Bezeichnung / Benamung der Headline

      Color scheme

      Initiale Farbschemen:

      • Normal: schwarz

      • Default: blau

      • Success: grün

      • Danger: rot

      Konfiguriert über Color Schemes

      CSS class

      Elemente einer Gruppe/Klasse zuordnen, für die bestimmte Formatierungen gelten sollen

      Option 1: in Properties bestehende Bootstrap-Klassen einfügen

      Option 2: über Hauptmenü in den Page Templates (für “alles verfügbar”)

      Option 3: Page definitions (nur für diese Seite)

      Tab index

      Legt die Navigation in der Page bzw. im Formular durch die Tab-Taste fest (Tab-Reihenfolge).

      Für jedes Formularfeld kann ein Tab-index vergeben werden.

      Access

      Access rights /Berechtigungen der Komponente:

      • Click: Klicken, um weitere Actions auszulösen

      • Read data: ausgegebenen Daten sehen / lesen

      Subtitle

      Unterüberschrift des Charts

      Title Location

      Anordnung der Überschriften

      • Top vs. Bottom

      • Left, Right, Center

      (im Bsp. oben Top / Center)

      Legend Location

      Anordnung der Legende

      • Top vs. Bottom

      • Left, Right, Center

      (im Bsp. Bottom / Center)

      Argument axis

      Bezeichnung / Beschreibung der y-Achse (im Bsp.: “Betrag”)

      Left value axis

      Einheit / Bezeichnung der x-Achse (im Bsp.: "Monate")

      Right value axis

      Einheit / Bezeichnung der x-Achse rechts (im Bsp.: keine Angabe)

      Series colors

      vier vorkonfigurierte Farbschemen:

      • Material → blau

      • Office → grün

      • Soft → gelb

      • Soft Pastel → helleres grün

      🔍Hinweis: Diese Einstellung zählt, wenn direkt in den Series keine Einstellungen vorgenommen worden sind. (Primär geltende Einstellung → “Series”)

      Series

      neue Series anlegen:

      • Bar Series (Balken)

      • Line Series (Linien)

      • Area Series (Flächen)

      • Financial Series (Stock und Candle Sticks)

      • Scatter Series (Punktwolke)

      • Bubble Series (Blasen)

      • Range Series (Bereiche)

      Einstellungs-/Konfigurationsmöglichkeiten der Series

      		 Datenvisualisierung über Charts

      2. Chart Funktionalitäten 

      Events

      Event

      Beschreibung

      ChartClicked

      This event fires when the chart was clicked.

      LegendClicked

      This event fires when the legend was clicked.

      Actions

      Kategorisierung

      Action

      Beschreibung

      State

      enable()

      Enable the chart.

      disable()

      Disable the chart.

      setEnabled(enabled)

      Enable/disable the chart.
      enabled: Flag to indicate enabled or disabled.

      show()

      Shows the chart.

      hide()

      Hides the chart.

      setVisible(visible)

      Show/hide the chart.
      visible: Flag to indicate shown or hidden.

      Appearance

      setTitle(title)

      Set the title of the chart.
      text: The title to set.

      Data

      refresh()

      Refresh data.