Examples

• Apr 17, 2025
• 6 minutes to read

This section provides a list of how-to examples contained in this help, grouped by features (2D Chart Types, 3D Chart Types, Providing Data, Appearance Customization, Data Representation, Chart Elements, End-User Interaction and Miscellaneous).

2D Chart Types

• How to: Create a 2D Area Chart
• How to: Create a 2D Spline Area Chart
• How to: Create a 2D Bubble Chart
• How to: Create a 2D Candle Stick Chart
• How to: Create a 2D Full-Stacked Area Chart
• How to: Create a 2D Full-Stacked Bar Chart
• How to: Create a 2D Full-Stacked Line Chart
• How to: Create a 2D Full-Stacked Spline Area Chart
• How to: Create a 2D Funnel Chart
• How to: Create a 2D Line Chart
• How to: Create a 2D Spline Chart
• How to: Create a 2D Nested Donut Chart
• How to: Create a 2D Overlapped Range Bar Chart
• How to: Create a 2D Pie (Donut) Chart
• How to: Create a 2D Point Chart
• How to: Create a 2D Polar Area Chart
• How to: Create a 2D Polar Line Chart
• How to: Create a 2D Scatter Polar Line Chart
• How to: Create a 2D Polar Point Chart
• How to: Create a 2D Radar Area Chart
• How to: Create a 2D Radar Line Chart
• How to: Create a 2D Scatter Radar Line Chart
• How to: Create a 2D Radar Point Chart
• How to: Create a 2D Range Area Chart
• How to: Create a 2D Scatter Line Chart
• How to: Draw a Custom Function in the 2D Scatter Line Chart
• How to: Create a 2D Side-by-Side Bar Chart
• How to: Create a 2D Side-by-Side Full-Stacked Bar Chart
• How to: Create a 2D Side-by-Side Range Bar Chart
• How to: Create a 2D Side-by-Side Stacked Bar Chart
• How to: Create a 2D Stacked Area Chart
• How to: Create a 2D Stacked Bar Chart
• How to: Create a 2D Stacked Line Chart
• How to: Create a 2D Stacked Spline Area Chart
• How to: Create a 2D Stock Chart
• How to: Create a 2D Step Area Chart
• How to: Create a 2D Step Line Chart

3D Chart Types

• How to: Create a 3D Area Chart
• How to: Create a 3D Bubble Chart
• How to: Create a 3D Full-Stacked Area Chart
• How to: Create a 3D Manhattan Bar Chart
• How to: Create a 3D Pie (Donut) Chart
• How to: Create a 3D Point Chart
• How to: Create a 3D Side-by-side Bar Chart
• How to: Create a 3D Stacked Area Chart

Providing Data

Binding

• How to: Bind a Chart to an Observable Collection
• How to: Bind a Chart to a Static Resource
• How to: Bind a Chart to Data from an MDB File
• How to: Bind a Chart to an XML Data Source using the XPath Property
• How to: Bind a Chart to an XML Data Source using a Complex Data Path

MVVM Binding

• How to: Bind Series to View Models Using the Item Template
• How to: Bind Series to View Models Using the Item Template Selector
• How to: Create a Real-Time Chart
• How to: Plot an XY Series with a Histogram in a Chart
• How to: Use the MVVM Binding Style to Generate Series of Different View Types

Bind Additional Values to a Chart

• How to: Colorize Charts Using the Color Object Colorizer
• How to: Colorize Charts Using the Key-Color Colorizer
• How to: Colorize Charts Using the Range Colorizer
• How to: Sort Qualitative Scale Values in a Custom Sort Order

Data Representation

• How to: Filter Data
• How to: Use a Custom Measure Units in Automatic Date-Time Scale Mode
• How to: Use a Custom Measure Unit in Automatic Numeric Scale Mode

Chart Elements

Panes

• How to: Plot Each XY-Series on a Separate Pane

Axes

• How to: Create and Customize Custom Axis Labels
• How to: Configure Resolve Overlapping for Axis Labels
• How to: Display Axis Labels Between Tickmarks
• How to: Show or Hide an Axis in a Multi-Pane Chart
• How to: Obtain Automatically Calculated Axis Property Values
• How to: Use Manual Date-Time Scale Options of an Axis
• How to: Use Manual Numeric Scale Options of an Axis

Analytical Tools

• How to: Add the Data Source Based Error Bars Indicator to a Chart
• How to: Add the Fixed Value Error Bars Indicator to a Chart
• How to: Add the Percentage Error Bars Indicator to a Chart
• How to: Add the Standard Error Bars Indicator to a Chart
• How to: Add the Standard Deviation Error Bars Indicator to a Chart

Legends

• How to: Add an Additional Legend
• How to: Add a Custom Legend Items to a Legend
• How to: Add a Legend Title to a Legend
• How to: Create a Scrollable Legend
• How to: Display Values Instead of Percents in the Legend

Annotations

• How to: Dock an Annotation to a Chart
• How to: Dock an Annotation to a Pane
• How to: Dock an Annotation to a Series Point

Appearance Customization

• How to: Change Point Colors
• How to: Format Values Displayed in a Crosshair Cursor Using a Crosshair Label’s Patterns
• How to: Customize the Appearance of Crosshair Series Labels
• How to: Customize the Appearance of Crosshair Axis Labels
• How to: Customize the Appearance of a Series Tooltip
• How to: Provide a Custom Template for Series Labels
• How to: Customize Axis Labels
• How to: Provide a Custom Tooltip for a Series Point
• How to: Customize Chart Titles
• How to: Custom Draw a Crosshair Cursor
• How to: Custom Draw Chart Series Points
• How to: Use Themes to Define the Look and Feel of Your Chart
• How to: Use the Chart Palette for Painting Series and their Points
• How to: Create Custom Series Point Model
• How to: Assign Different Models for Series and Point Markers
• How to: Adjust Series Labels
• How to: Configure the Appearance of an Annotation

End-User Interaction

• How to: Determine which Chart Element is Hovered by the Mouse Pointer
• How to: Display Custom Tooltips for Series Points
• How to: Animate Series Points in a 3D Chart
• How to: Animate a 3D Chart Series
• How to: Animate a 3D Chart Diagram
• How to: Animate Series Templates
• How to: Animate Series Points in a 2D Chart
• How to: Create a Movable Legend at Runtime
• How to: Display a Custom Cursor in the Chart Control
• How to: Implement Selection in the MVVM Style

Miscellaneous

• How to: Programmatically Create a Chart
• How to: Visualize Data from the DXPivotGrid Control using the DXCharts Suite
• How to: Use the Numeric Options of Series Points
• How to: Use the Percent Options of Series Points
• How to: Display Values Instead of Percents in the Legend
• How to: Bind a Numeric Chart Range Control Client to an Array of Simple Type Objects
• How to: Bind a Numeric Chart Range Control Client to a List of Custom Objects
• How to: Bind a Date-Time Chart Range Control Client to a List of Custom Objects
• How to: Print a Chart and Show its Print Preview
• How to: Export a Chart to HTML and MHT
• How to: Export a Chart to PDF