Inhaltsverzeichnis
API: Chart Controls
API-Referenz für Diagramme und Visualisierungen.
TWvdSChart
Basis-Chart-Control für alle Diagrammtypen.
Namespace
WvdS.UI.Controls.Charts
PXAML
<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>
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
<CandlestickSeries ArgumentDataMember="Date" OpenDataMember="Open" HighDataMember="High" LowDataMember="Low" CloseDataMember="Close" />
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
<Chart ChartType="Radar"> <RadarSeries ArgumentDataMember="Skill" ValueDataMember="Score" Fill="True" FillOpacity="0.3" /> </Chart>
TWvdSTreeMapSeries
TreeMap-Visualisierung.
PXAML
<Chart ChartType="TreeMap"> <TreeMapSeries LabelDataMember="Name" ValueDataMember="Size" GroupDataMember="Category" /> </Chart>
TWvdSSankeyDiagram
Sankey-Flussdiagramm.
PXAML
<SankeyDiagram DataSource="{Binding FlowData}" SourceDataMember="From" TargetDataMember="To" WeightDataMember="Value" />
Properties
| Property | Typ | Default | Beschreibung |
| SourceDataMember | string | | Quell-Knoten |
^ TargetDataMember | string | | Ziel-Knoten |
|---|---|---|---|
| WeightDataMember | string | '' | Flussstärke |
TWvdSWaterfallSeries
Wasserfall-Diagramm.
PXAML
<WaterfallSeries ArgumentDataMember="Category" ValueDataMember="Change" StartValue="1000" ShowTotal="True" />
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
Zuletzt geändert: den 29.01.2026 um 15:13