FlexChart provides various options to customize the appearance of the chart and its elements — from color palettes and series-level styling to per-element control of headers, axes, legends, data labels and tooltips. This overview gives a quick snapshot of each topic and when to use it.
Appearance and Styling
Topic | Use Case |
|---|
Appearance and Styling | Use for color and style choices that apply chart-wide or per-series. Set Palette (16 pre-defined palettes from the C1.Chart.Palette enumeration; default Standard) for a one-line color scheme. Create a custom palette by setting Palette="Palette.Custom" with a CustomPalette list of colors. Style individual series through the Series.Style property — for example Style="fill:red" or use rgba() for semi-transparent fills. |
Chart Elements (under Elements)
Topic | Use Case |
|---|
Axes | Use AxisX and AxisY to control position (Position), axis title (Title / TitleStyle), tick marks (MajorTickMarks, MinorTickMarks, TickLength), grid lines (MajorGrid, MinorGrid, MajorGridStyle, MinorGridStyle), labels (Labels, LabelMax, LabelMin, LabelAlignment), axis line visibility (AxisLine), and reversed display (Reversed). Configure axes inside an <AxisCollection>. |
Legend | Use LegendPosition (Auto, Top, Bottom, Left, Right) for placement, LegendStyle for styling, and LegendToggle to let users show/hide series by clicking legend items. When many series are present, set LegendScrollbars (from the LegendScrollBars enumeration) to add a scrollbar to the legend. |
Header and Footer | Use HeaderContent and FooterContent to add a title and footer. Style each with HeaderStyle and FooterStyle (CSS-style strings such as font-size:24px). |
Multiple Plot Area | Use to split series into separate plot areas within a single chart for better readability when overlapped series are hard to compare. Add <PlotArea> elements to a <PlotAreaCollection> (with Name, Width, Height, Row, Column), then assign each axis and series to a plot area by name via PlotAreaName (on Axis) and AxisX/AxisY (on Series). Multiple plot areas are more readable than multiple overlapped series because each series gets its own plotting region while sharing the overall chart frame. |
Series Collection | Use to define the data series plotted on the chart. Each <Series> in a <SeriesCollection> sets its Name, Binding (Y-axis property), and optionally its own ItemsSource, BindingX, ChartType, Style, AxisX, and AxisY for per-series overrides. By default, FlexChart shows a column chart with dummy data at design time; at runtime, provide real data through ItemsSource and BindingX/Binding on the chart or per series. |
|
|
