WinForms Data Grid with Integrated Chart Support (v17.2)

As you may already know, our most recent release includes an important update to our WinForms Grid and its ability to display charts and visualize data within individual grid cells.

In previous versions, your ability to embed a chart within a grid cell required writing lots of custom code. With v17.2, we’ve reduced this requirement significantly and improved overall functionality. Simply said, v17.2 creates a real nexus between our WinForms Grid and WinForms Chart controls – a nexus designed to help you deliver the best possible user experience across a variety of usage scenarios.

Improved User Experiences for WinForms Developers

Before I show you how easy it is to use this feature, I want to describe why we’ve worked to improve the nexus between our Grid and Chart controls and why you should consider its use for your next WinForms project.

As I hope the following image demonstrates, embedding a chart within our WinForms Grid offers numerous UI/analytics options that simply do not exist when using standalone charts.

This sample app details sales trends/sales projections by state. When data visualizations (charts) are incorporated into our Grid, key information is available to end-users at a single glance. Were we to try and analyze this data using a standalone chart, users would need to navigate individual records and would be unable to understand relevance/consequence in a single snapshot.

Go Beyond the Ordinary

If you’ve used our WinForms Grid in the past, you may be familiar with our Sparkline cell editor – a visualization option designed for simple use-case scenarios.

The nexus between our Grid and Chart control gives you endless visualization options that do not exist when using sparklines. From cross-hair cursors to the display of multiple series (see image above), you can now create decision support systems that are informative AND intuitive…Yes, with v17.2, you can reduce screen clutter and UI complexity – you can improve usability and create apps that exceed expectations.

Getting Started

Adding a chart to individual WinForms Grid cells is easy – here’s how we created the sample used in this blog post.

private void Form1_Load(object sender, EventArgs e) {
    Series saleSeries = new Series("Sales", ViewType.Area);
    saleSeries.ArgumentDataMember = "DetailData.ReportDate";
    saleSeries.ValueDataMembers.AddRange("DetailData.Sales");
    chartSaleHistory.Series.Add(saleSeries);

    Series targetSeries = new Series("Sales", ViewType.Line);
    targetSeries.ArgumentDataMember = "DetailData.ReportDate";
    targetSeries.ValueDataMembers.AddRange("DetailData.SalesTarget");
    chartSaleHistory.Series.Add(targetSeries);

    RepositoryItemAnyControl chartRepositoryItem =
       new RepositoryItemAnyControl();
    chartRepositoryItem.Control = chartSalesHistory;
    gridControl.RepositoryItems.Add(chartRepositoryItem);
    colSalesHistory.ColumnEdit = chartRepositoryItem;

    gridView.CustomUnboundColumnData += OnCustomUnboundColumnData;
}

void OnCustomUnboundColumnData(object sender,
       DevExpress.XtraGrid.Views.Base.CustomColumnDataEventArgs e) {
    if(e.IsGetData) e.Value = e.Row;
}

A Word on Performance

All charts displayed within our WinForms Grid are cached and will have a minimal impact on performance. Needless to say, each situation and use case is different so if you do encounter performance issues, please don’t hesitate to contact our support team – we’ll be more than happy to assist.

Tell us what you think – how likely are you to embed Charts within our WinForms Grid control? Will you be able to leverage this new feature in your next project?