====== API: Chart Controls ======

API-Referenz für Diagramme und Visualisierungen.

===== TWvdSChart =====

Basis-Chart-Control für alle Diagrammtypen.

==== Namespace ====

''WvdS.UI.Controls.Charts''

==== PXAML ====

<code xml>
<Chart Title="Sales Overview">
  <Chart.Series>
    <LineSeries Title="Revenue"
                ArgumentDataMember="Month"
                ValueDataMember="Revenue"
                DataSource="{Binding SalesData}" />
    <BarSeries Title="Orders"
               ArgumentDataMember="Month"
               ValueDataMember="OrderCount"
               DataSource="{Binding SalesData}" />
  </Chart.Series>
  <Chart.Legend Position="Right" />
</Chart>
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ Title | string | '' | Diagrammtitel |
^ Series | TWvdSSeriesCollection | nil | Datenreihen |
^ Legend | TWvdSLegend | nil | Legende |
^ AxisX | TWvdSAxis | nil | X-Achse |
^ AxisY | TWvdSAxis | nil | Y-Achse |
^ Palette | TWvdSPalette | nil | Farbpalette |
^ EnableZoom | Boolean | False | Zoom aktiviert |
^ EnablePan | Boolean | False | Schwenken aktiviert |

==== Events ====

| Event | Signatur | Beschreibung |
^ OnSeriesClick | TSeriesClickEvent | Klick auf Datenpunkt |
^ OnLegendClick | TLegendClickEvent | Klick auf Legende |

----

===== TWvdSSparkline =====

Kompakte Inline-Diagramme.

==== Namespace ====

''WvdS.UI.Controls.Charts''

==== PXAML ====

<code xml>
<Sparkline Type="Line"
           Data="{Binding TrendData}"
           Width="100" Height="20" />
<Sparkline Type="Bar"
           Data="{Binding Values}"
           HighlightMin="True" HighlightMax="True" />
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ Type | TWvdSSparklineType | stLine | Line, Bar, WinLoss, Area |
^ Data | TDoubleArray | nil | Datenpunkte |
^ HighlightMin | Boolean | False | Minimum hervorheben |
^ HighlightMax | Boolean | False | Maximum hervorheben |
^ NegativeColor | TWvdSColor | clRed | Farbe für negative Werte |

----

===== Series-Typen =====

Alle Series teilen gemeinsame Basis-Properties:

| Property | Typ | Beschreibung |
^ Title | string | Reihen-Titel |
^ DataSource | IEnumerable | Datenquelle |
^ ArgumentDataMember | string | X-Wert Feld |
^ ValueDataMember | string | Y-Wert Feld |
^ Color | TWvdSColor | Farbe |
^ Visible | Boolean | Sichtbar |

----

===== TWvdSLineSeries =====

Liniendiagramm.

==== PXAML ====

<code xml>
<LineSeries Title="Temperature"
            ArgumentDataMember="Date"
            ValueDataMember="Temp"
            MarkerType="Circle"
            LineStyle="Solid" />
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ MarkerType | TWvdSMarkerType | mtNone | None, Circle, Square, Triangle |
^ MarkerSize | Integer | 8 | Marker-Größe |
^ LineStyle | TWvdSLineStyle | lsSolid | Solid, Dash, Dot |
^ LineWidth | Integer | 2 | Linienbreite |

----

===== TWvdSAreaSeries =====

Flächendiagramm.

==== PXAML ====

<code xml>
<AreaSeries Title="Revenue"
            ArgumentDataMember="Month"
            ValueDataMember="Amount"
            Opacity="0.7" />
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ Opacity | Double | 0.5 | Transparenz (0-1) |
^ ShowLine | Boolean | True | Obere Linie anzeigen |

----

===== TWvdSBarSeries =====

Balkendiagramm.

==== PXAML ====

<code xml>
<BarSeries Title="Sales"
           ArgumentDataMember="Product"
           ValueDataMember="Quantity"
           BarWidth="0.8" />
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ BarWidth | Double | 0.6 | Balkenbreite (0-1) |
^ CornerRadius | Integer | 0 | Eckenradius |
^ ShowLabels | Boolean | False | Werte anzeigen |

----

===== TWvdSPieSeries =====

Kreisdiagramm.

==== PXAML ====

<code xml>
<Chart>
  <PieSeries ArgumentDataMember="Category"
             ValueDataMember="Value"
             InnerRadius="0"
             StartAngle="0"
             ShowLabels="True" />
</Chart>
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ InnerRadius | Double | 0 | Donut-Loch (0=Pie) |
^ StartAngle | Double | 0 | Startwinkel |
^ ShowLabels | Boolean | True | Labels anzeigen |
^ ExplodeOffset | Double | 0 | Segment-Abstand |

----

===== TWvdSFunnelSeries =====

Trichterdiagramm für Sales Funnels.

==== PXAML ====

<code xml>
<Chart>
  <FunnelSeries ArgumentDataMember="Stage"
                ValueDataMember="Count"
                NeckHeight="0.3"
                NeckWidth="0.3" />
</Chart>
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ NeckHeight | Double | 0.3 | Halshöhe (0-1) |
^ NeckWidth | Double | 0.3 | Halsbreite (0-1) |
^ GapRatio | Double | 0 | Abstand zwischen Segmenten |

----

===== TWvdSScatterSeries =====

Streudiagramm.

==== PXAML ====

<code xml>
<ScatterSeries ArgumentDataMember="X"
               ValueDataMember="Y"
               MarkerType="Circle"
               MarkerSize="10" />
</code>

----

===== TWvdSBubbleSeries =====

Blasendiagramm.

==== PXAML ====

<code xml>
<BubbleSeries ArgumentDataMember="X"
              ValueDataMember="Y"
              SizeDataMember="Size"
              MinBubbleSize="10"
              MaxBubbleSize="50" />
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ SizeDataMember | string | '' | Feld für Blasengröße |
^ MinBubbleSize | Integer | 10 | Minimale Blasengröße |
^ MaxBubbleSize | Integer | 50 | Maximale Blasengröße |

----

===== TWvdSCandlestickSeries =====

Candlestick-Chart für Börsendaten.

==== PXAML ====

<code xml>
<CandlestickSeries ArgumentDataMember="Date"
                   OpenDataMember="Open"
                   HighDataMember="High"
                   LowDataMember="Low"
                   CloseDataMember="Close" />
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ OpenDataMember | string | '' | Eröffnungskurs |
^ HighDataMember | string | '' | Höchstkurs |
^ LowDataMember | string | '' | Tiefstkurs |
^ CloseDataMember | string | '' | Schlusskurs |
^ UpColor | TWvdSColor | clGreen | Farbe bei Gewinn |
^ DownColor | TWvdSColor | clRed | Farbe bei Verlust |

----

===== TWvdSRadarSeries =====

Radar/Spider-Diagramm.

==== PXAML ====

<code xml>
<Chart ChartType="Radar">
  <RadarSeries ArgumentDataMember="Skill"
               ValueDataMember="Score"
               Fill="True"
               FillOpacity="0.3" />
</Chart>
</code>

----

===== TWvdSTreeMapSeries =====

TreeMap-Visualisierung.

==== PXAML ====

<code xml>
<Chart ChartType="TreeMap">
  <TreeMapSeries LabelDataMember="Name"
                 ValueDataMember="Size"
                 GroupDataMember="Category" />
</Chart>
</code>

----

===== TWvdSSankeyDiagram =====

Sankey-Flussdiagramm.

==== PXAML ====

<code xml>
<SankeyDiagram DataSource="{Binding FlowData}"
               SourceDataMember="From"
               TargetDataMember="To"
               WeightDataMember="Value" />
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ SourceDataMember | string | '' | Quell-Knoten |
^ TargetDataMember | string | '' | Ziel-Knoten |
^ WeightDataMember | string | '' | Flussstärke |

----

===== TWvdSWaterfallSeries =====

Wasserfall-Diagramm.

==== PXAML ====

<code xml>
<WaterfallSeries ArgumentDataMember="Category"
                 ValueDataMember="Change"
                 StartValue="1000"
                 ShowTotal="True" />
</code>

==== Properties ====

| Property | Typ | Default | Beschreibung |
^ StartValue | Double | 0 | Startwert |
^ ShowTotal | Boolean | True | Gesamtsumme anzeigen |
^ PositiveColor | TWvdSColor | clGreen | Farbe positiv |
^ NegativeColor | TWvdSColor | clRed | Farbe negativ |

----

===== Siehe auch =====

  * [[.:control-bibliothek|Control-Bibliothek]]
  * [[.:api-controls-gauges|Gauges API]]
  * [[.:api-controls-data|Data Controls API]]