Element: Line Chart

Mit diesem Element können Liniendiagramme erstellt werden. Die Werte für das Diagramm können im contentDock® Management System manuell gesetzt oder mit DatenContainer-Tabellen verbunden werden. Das Line Chart Element besteht aus den Sub-Elementen X-Achse, Y-Achse und der Diagramm-Legende. Alle diese Sub-Elemente nutzen eigene Styles für die Darstellung.

Beispiel App

Sie können dieses Element mit Beispiel-Styles direkt im öffentlichen Bereich der contentDock® Viewer App testen. Zusätzlich können Sie diese Beispiel-Styles auch aus der Vorlagen-Bibliothek in Ihren Benutzer-Account laden und in Ihr App-Projekt importieren.

Styles

  • Hintergrund
    Farbe
    Contentdock color help
    Definiert die Farbe für den Hintergrund des Elements. Die Farbe wird in der kompletten Größe des Elements verwendet. Mögliche Werte sind hexadezimale sowie RGBA Farbwerte.

    Beim hexadezimalen Farbsystem werden drei aufeinanderfolgende Hexadezimalzahlen verwendet, die jeweils für eine Farbe des RGB-Farbraums stehen. Beispiel: #ffffff für die Farbe Weiß.

    Das RGBA Farbsystem ist vom RGB System um einen Alphawert für Transparenzen erweitert. Beispiel: rgba(255,255,255,0.5) für die Farbe Weiß mit einem Alphawert 0.5.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    rgba(255,255,255,0)

    Bild
    Contentdock background image help
    Definiert das Hintergrundbild für das Element. Das Bild wird skaliert im Element dargestellt.
  • Rahmen
    Höhe
    Contentdock line chart border height help
    Definiert die Stärke des Rahmens in Pixel, der das Element umschließt. Der Wert wird individuell in einem Eingabefeld gesetzt.

    Bitte beachten Sie, dass nur ganze Zahlen eingegeben werden. Ein "px" muss nicht erfasst werden.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    0

    Radius
    Contentdock line chart border radius help
    Definiert den Radius des Rahmens in Pixel, der in den Element-Ecken verwendet wird. Der Wert wird individuell in einem Eingabefeld gesetzt.

    Bitte beachten Sie, dass nur ganze Zahlen eingegeben werden. Ein "px" muss nicht erfasst werden.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    0

    Farbe
    Contentdock color help
    Definiert die Farbe für den Rahmen des Elements. Mögliche Werte sind hexadezimale sowie RGBA Farbwerte.

    Beim hexadezimalen Farbsystem werden drei aufeinanderfolgende Hexadezimalzahlen verwendet, die jeweils für eine Farbe des RGB-Farbraums stehen. Beispiel: #ffffff für die Farbe Weiß.

    Das RGBA Farbsystem ist vom RGB System um einen Alphawert für Transparenzen erweitert. Beispiel: rgba(255,255,255,0.5) für die Farbe Weiß mit einem Alphawert 0.5.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    rgba(255,255,255,0)

    Position
    Contentdock line chart border position help
    Hiermit geben Sie die Position des Rahmens an. Der Rahmen umschließt immer das Element, allerdings können Sie wählen in welche Richtung der Rahmen gezeichnet wird.

    Mögliche Werte sind:

    Innen: Der Rahmen wird nach innen gezeichnet.

    Außen: Der Rahmen wird nach außen gezeichnet.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    inner

  • Diagramm
    Linientyp
    Contentdock line chart line style help
    Definiert den generellen Linientyp.

    Mögliche Werte sind:

    Gerade: Die Linienverbindungen zwischen den Werte-Punkten sind gerade.

    Gebogen: Die Linienverbindungen zwischen den Werte-Punkten sind gebogen.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    curved

  • Diagramm-Linienwert
    Höhe der Diagrammlinie
    Contentdock line chart line height help
    Definiert die Stärke der Diagramm-Linien.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    2

    Darstellung Linienwert
    Contentdock line chart line value icon help
    Definiert das Icon der Werte-Punkte in der Diagramm-Linie.

    Mögliche Werte sind:

    Kreis: Die Werte-Punkte werden als Kreis dargestellt.

    Quadrat: Die Werte-Punkte werden als Quadrat dargestellt.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    circle

    Größe Darstellung Linienwert
    Contentdock line chart line value icon height help
    Definiert die Größe des Icons für den Werte-Punkt.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    8

    Farbanpassung Linienwert
    Contentdock line chart line value icon color adjust help
    Definiert den Typ für die Farbanpassung des Werte-Punkt Icons.

    Mögliche Werte sind:

    Heller: Die Farbe für das Icon wird heller dargestellt.

    Dunkler: Die Farbe für das Icon wird dunkler dargestellt.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    darker

    Farbanpassung in % Linienwert
    Contentdock line chart line value icon color percent help
    Definiert den prozentualen Wert für die Farbanpassung des Werte-Punkt Icons.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    10

Info layer chart value point (sub element)

  • Hintergrund
    Farbe
    Contentdock color help
    Definiert die Farbe für den Hintergrund des Layers. Die Farbe wird in der kompletten Größe des Layers verwendet. Mögliche Werte sind hexadezimale sowie RGBA Farbwerte.

    Beim hexadezimalen Farbsystem werden drei aufeinanderfolgende Hexadezimalzahlen verwendet, die jeweils für eine Farbe des RGB-Farbraums stehen. Beispiel: #ffffff für die Farbe Weiß.

    Das RGBA Farbsystem ist vom RGB System um einen Alphawert für Transparenzen erweitert. Beispiel: rgba(255,255,255,0.5) für die Farbe Weiß mit einem Alphawert 0.5.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    rgba(0,0,0,0.4)

    Bild
    Contentdock background image help
    Definiert das Hintergrundbild für den Layer. Das Bild wird skaliert im Layer dargestellt.
  • Rahmen
    Höhe
    Contentdock chart info layer border height help
    Definiert die Stärke des Rahmens in Pixel, der den Layer umschließt. Der Wert wird individuell in einem Eingabefeld gesetzt.

    Bitte beachten Sie, dass nur ganze Zahlen eingegeben werden. Ein "px" muss nicht erfasst werden.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    4

    Radius
    Contentdock chart info layer border radius help
    Definiert den Radius des Rahmens in Pixel, der in den Layer-Ecken verwendet wird. Der Wert wird individuell in einem Eingabefeld gesetzt.

    Bitte beachten Sie, dass nur ganze Zahlen eingegeben werden. Ein "px" muss nicht erfasst werden.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    5

    Farbe
    Contentdock color help
    Definiert die Farbe für den Rahmen des Layers. Mögliche Werte sind hexadezimale sowie RGBA Farbwerte.

    Beim hexadezimalen Farbsystem werden drei aufeinanderfolgende Hexadezimalzahlen verwendet, die jeweils für eine Farbe des RGB-Farbraums stehen. Beispiel: #ffffff für die Farbe Weiß.

    Das RGBA Farbsystem ist vom RGB System um einen Alphawert für Transparenzen erweitert. Beispiel: rgba(255,255,255,0.5) für die Farbe Weiß mit einem Alphawert 0.5.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    rgba(0,0,0,0.8)

    Position
    Contentdock chart info layer border position help
    Hiermit geben Sie die Position des Rahmens an. Der Rahmen umschließt immer den Layer, allerdings können Sie wählen in welche Richtung der Rahmen gezeichnet wird.

    Mögliche Werte sind:

    Innen: Der Rahmen wird nach innen gezeichnet.

    Außen: Der Rahmen wird nach außen gezeichnet.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    outer

  • Innerer Abstand
    Nach oben
    Contentdock chart info layer padding top help
    Definiert den Abstand zwischen dem oberen Rand des "Layers" und dem Text.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    10

    Nach unten
    Contentdock chart info layer padding bottom help
    Definiert den Abstand zwischen dem unteren Rand des "Layers" und dem Text.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    10

    Nach links
    Contentdock chart info layer padding left help
    Definiert den Abstand zwischen dem linken Rand des "Layers" und dem Text.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    10

    Nach rechts
    Contentdock chart info layer padding right help
    Definiert den Abstand zwischen dem rechten Rand des "Layers" und dem Text.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    10

  • Titel Schrift
    Schriftart
    Contentdock font family help
    Definiert die Schriftart für den Titel-Text im Layer.

    In contentDock® sind diverse Schriften von fonts.google.com bereits installiert. Sie können aber auch ihre eigenen Schriften in contentDock® als TTF (TrueType Font) oder OTF (OpenType Font) laden.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    Open Sans Light

    Schriftgröße
    Contentdock font size help
    Definiert die Größe des Titel-Textes im Layer. Der Wert wird aus einem Dropdown ausgewählt oder kann individuell gesetzt werden.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    14

    Benutze Diagramm-Wertfarbe für Titel
    Contentdock chart info layer use chart color title help
    Ist dieser Style aktiviert, wird für den Titel-Text die definierte Farbe aus dem Diagramm-Item verwendet.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    0

    Farbe
    Contentdock color help
    Wird nur verwendet, wenn der Style "Benutze Diagramm-Wertfarbe für Titel" nicht aktiviert ist.
    Definiert die Farbe für den Titel-Text im Layer.

    Mögliche Werte sind hexadezimale sowie RGBA Farbwerte.

    Beim hexadezimalen Farbsystem werden drei aufeinanderfolgende Hexadezimalzahlen verwendet, die jeweils für eine Farbe des RGB-Farbraums stehen. Beispiel: #ffffff für die Farbe Weiß.

    Das RGBA Farbsystem ist vom RGB System um einen Alphawert für Transparenzen erweitert. Beispiel: rgba(255,255,255,0.5) für die Farbe Weiß mit einem Alphawert 0.5.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    #ffffff

  • Ausrichtung
    Ausrichtung
    Contentdock text align help
    Definiert die grundsätzliche Ausrichtung des Textes innerhalb des Layers.

    Mögliche Werte sind:

    links: Der Text ist links ausrichtet.

    rechts: Der Text ist nach rechts ausgerichtet.

    zentriert: Der Text ist im Layer zentriert.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    center

  • Diagrammwert Schrift
    Schriftart
    Contentdock font family help
    Definiert die Schriftart für den Werte-Text im Layer.

    In contentDock® sind diverse Schriften von fonts.google.com bereits installiert. Sie können aber auch ihre eigenen Schriften in contentDock® als TTF (TrueType Font) oder OTF (OpenType Font) laden.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    Open Sans Light

    Schriftgröße
    Contentdock font size help
    Definiert die Größe des Werte-Textes im Layer. Der Wert wird aus einem Dropdown ausgewählt oder kann individuell gesetzt werden.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    70

    Benutze Diagramm-Wertfarbe für Titel
    Contentdock chart info layer use chart color value help
    Ist dieser Style aktiviert, wird für den Werte-Text die definierte Farbe aus dem Diagramm-Item verwendet.

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    1

    Farbe
    Contentdock color help
    Wird nur verwendet, wenn der Style "Benutze Diagramm-Wertfarbe für Titel" nicht aktiviert ist.
    Definiert die Farbe für den Werte-Text im Layer.

    Mögliche Werte sind hexadezimale sowie RGBA Farbwerte.

    Beim hexadezimalen Farbsystem werden drei aufeinanderfolgende Hexadezimalzahlen verwendet, die jeweils für eine Farbe des RGB-Farbraums stehen. Beispiel: #ffffff für die Farbe Weiß.

    Das RGBA Farbsystem ist vom RGB System um einen Alphawert für Transparenzen erweitert. Beispiel: rgba(255,255,255,0.5) für die Farbe Weiß mit einem Alphawert 0.5.
  • Layer-Verhalten
    Abstand zwischen Titel und Wert

    Voreingestellter Systemwert

    Dieser Wert wird verwendet, wenn kein Style für dieses Element definiert ist.

    10