Load Data to Charts with DevExpress Presentation API
- 5 minutes to read
This topic describes how to load data into presentation charts. Charts require a data source to display data. You can specify chart data directly in code or populate embedded spreadsheet cells with data and reference those cells from a series.
Specify Series Data by a Cell Reference
Both Chart and ChartEx expose the Data property that returns a ChartData object — an embedded spreadsheet associated with the chart.
Use the Data indexer to access individual cells and set their values. The indexer accepts a sheet index and a cell reference string, and returns a CellValue object.
Set the CellValue.NumericValue, CellValue.DateTimeValue, CellValue.BooleanValue or CellValue.TextValue property to specify the cell value.
After you populate cells, create a ChartDataReference that points to the cell range and assign it to the series Arguments and Values properties.
Charts accept cell references in A1 style.
The following code snippet loads chart data from the embedded spreadsheet cells to a series:
using DevExpress.Docs.Office;
using DevExpress.Docs.Presentation;
using System.Drawing;
namespace PresentationApiSample;
public class Program {
public static async Task Main(string[] _) {
// Create a presentation.
Presentation presentation = new Presentation();
// Reset the slide collection.
presentation.Slides.Clear();
// Add a blank slide.
Slide slide = new Slide(SlideLayoutType.Blank);
presentation.Slides.Add(slide);
// Insert a chart that fills the slide.
Chart chart = new Chart();
chart.Width = presentation.SlideSize.Width;
chart.Height = presentation.SlideSize.Height;
slide.Shapes.Add(chart);
// Populate chart data.
chart.Data[0, "A1"].NumericValue = 120;
chart.Data[0, "A2"].NumericValue = 95;
chart.Data[0, "A3"].NumericValue = 140;
chart.Data[0, "B1"].TextValue = "Q1";
chart.Data[0, "B2"].TextValue = "Q2";
chart.Data[0, "B3"].TextValue = "Q3";
// Bind series values and arguments to chart data ranges.
BarSeries series = new BarSeries();
series.Values = new ChartDataReference(sheetIndex: 0, fromCellReference: "A1", toCellReference: "A3");
series.Arguments = new ChartDataReference(sheetIndex: 0, fromCellReference: "B1", toCellReference: "B3");
// Add the series to the chart.
chart.Series.Add(series);
// Set chart title formatting.
chart.Title = new ChartTitle(new TextArea {
Text = "Chart Title",
Level1ParagraphProperties = new TextParagraphProperties {
TextProperties = new TextProperties { FontSize = 30, Fill = new SolidFill(Color.DarkBlue) }
}
});
}
}
Use the following properties to check the type of data stored in a cell:
Specify Series Data Directly in Code
You can also pass data arrays directly to a series without populating the embedded spreadsheet with data first.
Use ChartStringData and ChartNumericData instances to specify the series Arguments and Values properties.
Note: The format does not allow adding date/time data in this approach.
The following code snippet specifies series data directly in code:
using DevExpress.Docs.Office;
using DevExpress.Docs.Presentation;
using System.Drawing;
namespace PresentationApiSample;
public class Program {
public static async Task Main(string[] _) {
// Create a presentation.
Presentation presentation = new Presentation();
// Reset the slide collection.
presentation.Slides.Clear();
// Add a blank slide.
Slide slide = new Slide(SlideLayoutType.Blank);
presentation.Slides.Add(slide);
// Insert a chart on the slide.
ChartEx chart = new ChartEx();
slide.Shapes.Add(chart);
// Set chart size to match the slide.
chart.Width = presentation.SlideSize.Width;
chart.Height = presentation.SlideSize.Height;
// Create a waterfall series and specify data.
WaterfallSeries series = new WaterfallSeries();
series.Text = "Cash Flow";
series.Arguments = new ChartStringData(new[] { "Start", "Jan", "Feb", "Mar", "End" });
series.Values = new ChartNumericData(new[] { 0.0, 12.0, -5.0, 8.0, 15.0 });
// Add the series to the chart.
chart.Series.Add(series);
// Set chart title formatting.
chart.Title = new ChartTitleEx(new TextArea {
Text = "Waterfall chart",
Level1ParagraphProperties = new TextParagraphProperties {
TextProperties = new TextProperties { FontSize = 30, Fill = new SolidFill(Color.DarkBlue) }
}
});
}
}