Example E4986
Visible to All Users

WPF Data Grid - Display Sparklines

This example demonstrates how to display sparklines in grid cells to visualize data trends.

WPF Data Grid - Display Arear Sparklines

The WPF SparklineEdit control includes dozens of appearance options and ships with the following chart types: Area, Bar, Line, Win/Loss. In this example, the Grid control displays area charts (sparklines). Replace AreaSparklineStyleSettings with another style object to change the chart type. Options include:

Files to Review

Documentation

Does this example address your development requirements/objectives?

(you will be redirected to DevExpress.com to submit your response)

Example Code

SparklineInGrid/MainWindow.xaml
XAML
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid" x:Class="SparklineInGrid.MainWindow" Title="MainWindow" Height="562" Width="665" > <Grid> <dxg:GridControl x:Name="grid" ItemsSource="{Binding SalesData}" > <dxg:GridControl.Columns> <dxg:GridColumn FieldName="Title" Header="Order" ReadOnly="True" Width="200"/> <dxg:GridColumn FieldName="SparklineData" Header="Sales" Width="200"> <dxg:GridColumn.EditSettings> <dxe:SparklineEditSettings PointArgumentMember="ArgumentColumn" PointValueMember="ValueColumn"> <dxe:SparklineEditSettings.PointArgumentRange> <dxe:Range Auto="False" Limit1="07/17/2013" Limit2="08/15/2013" /> </dxe:SparklineEditSettings.PointArgumentRange> <dxe:SparklineEditSettings.StyleSettings> <dxe:AreaSparklineStyleSettings Brush="BlueViolet" HighlightMaxPoint="True" HighlightMinPoint="True" MaxPointBrush="Red" MinPointBrush="Blue" /> </dxe:SparklineEditSettings.StyleSettings> </dxe:SparklineEditSettings> </dxg:GridColumn.EditSettings> </dxg:GridColumn> </dxg:GridControl.Columns> </dxg:GridControl> </Grid> </Window>
SparklineInGrid/MainWindow.xaml.cs(vb)
C#
using System; using System.Collections; using System.Collections.Generic; using System.Collections.ObjectModel; using System.Threading; using System.Windows; using DevExpress.Xpf.Utils; namespace SparklineInGrid { public partial class MainWindow : Window { public List<SalesDataRow> SalesData { get; set; } public MainWindow() { InitializeComponent(); grid.DataContext = this; SalesData = new List<SalesDataRow>(); int rowsCount = 20; for (int i = 0; i < rowsCount; i++) SalesData.Add(new SalesDataRow() { Title = String.Format("Index: {0}", i+1), SparklineData = GenerateSparklineData() }); } Random random = new Random(); IList GenerateSparklineData() { ObservableCollection<SalesItem> sparklineData = new ObservableCollection<SalesItem>(); DateTime dateTime = new DateTime(2013, 07, 17); for (int i=0; i < 30; i++) sparklineData.Add(new SalesItem() { ValueColumn = random.Next(-20, 20), ArgumentColumn = dateTime.AddDays(i) }); return sparklineData; } } public class SalesDataRow { public object Title { get; set; } public IList SparklineData { get; set; } } public class SalesItem { public object ArgumentColumn { get; set; } public int ValueColumn { get; set; } } }

Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.