TimeSpanChartRangeControlClient.GridAlignment Property

Gets or sets the time-span measurement unit to which the chart’s gridlines and labels should be aligned.

Namespace: DevExpress.Xpf.Charts.RangeControlClient

Assembly: DevExpress.Xpf.Charts.v24.2.dll

NuGet Package: DevExpress.Wpf.Charts

Declaration

C#

public TimeSpanGridAlignment GridAlignment { get; set; }

VB.NET

Public Property GridAlignment As TimeSpanGridAlignment

Property Value

Type	Description
TimeSpanGridAlignment	A TimeSpanGridAlignment enumeration value that represents the measurement unit to which the chart’s gridlines and labels should be aligned.

Available values:

Name	Description
Millisecond	Specifies a millisecond as the time-span unit to which axis grid lines should be aligned.
Second	Specifies a second as the time-span unit to which axis grid lines should be aligned.
Minute	Specifies a minute as the time-span unit to which axis grid lines should be aligned.
Hour	Specifies an hour as the time-span unit to which axis grid lines should be aligned.
Day	Specifies a day as the time-span unit to which axis gridlines should be aligned.
Auto	The time-span unit to which axis gridlines should be aligned is calculated automatically.

Remarks

The GridAlignment option is in effect if the ChartRangeControlClientBase.ShowGridLines property is set to true.

The following images demonstrate the GridAlignment property in action.

GridAlignment = Hour, GridSpacing = 4	GridAlignment = Hour, GridSpacing = 8

Example

This example demonstrates how to use the time-span chart client for a range control to display a chart with time-span data within the range control’s viewport.

In this example, a time-span chart range control client is bound to a System.Collections.Generic.List containing DataSourceItem objects.

Each DataSourceItem object contains Argument and Value properties, to which a time-span chart range control client is bound via its ChartRangeControlClient.ArgumentDataMember and ChartRangeControlClient.ValueDataMember properties.

XAML

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:TimeSpanChartRangeControlClient"
        xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" 
        xmlns:Custom="http://schemas.devexpress.com/winfx/2008/xaml/charts/rangecontrolclient" 
        x:Class="TimeSpanChartRangeControlClient.MainWindow"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <dxe:RangeControl>
            <Custom:TimeSpanChartRangeControlClient ArgumentDataMember="Argument" 
                                                    ValueDataMember="Value" 
                                                    ItemsSource="{Binding}" 
                                                    GridAlignment="Hour"
                                                    GridSpacing="8"
                                                    SnapAlignment="Hour"> 
                <Custom:TimeSpanChartRangeControlClient.View>
                    <Custom:RangeControlClientLineView ShowMarkers="True" 
                                                       MarkerSize="8"/>
                </Custom:TimeSpanChartRangeControlClient.View>
            </Custom:TimeSpanChartRangeControlClient>
        </dxe:RangeControl>
    </Grid>
</Window>

C#

using System;
using System.Collections.Generic;
using System.Windows;
namespace TimeSpanChartRangeControlClient {
    public class DataSourceItem {
        public object Argument { get; set; }
        public object Value { get; set; }
    }
    public partial class MainWindow : Window {
        const int dataCount = 100;
        List<DataSourceItem> data = new List<DataSourceItem>();
        List<DataSourceItem> GenerateDateTimeData() {
            List<DataSourceItem> data = new List<DataSourceItem>();
            Random rand = new Random();
            double value = 0;
            for (int i = 0; i < dataCount; i++) {
                value += (rand.NextDouble() - 0.5);
                data.Add(new DataSourceItem() { Argument = TimeSpan.FromMinutes(i * 30),
                                                Value = Math.Abs(value + Math.Sin(i * 0.6)) });
            }
            return data;
        }
        public MainWindow() {
            InitializeComponent();
            this.DataContext = GenerateDateTimeData();
        }
    }
}

VB.NET

Imports System
Imports System.Collections.Generic
Imports System.Windows
Namespace TimeSpanChartRangeControlClient
    Public Class DataSourceItem
        Public Property Argument As Object
        Public Property Value As Object
    End Class
    Public Partial Class MainWindow
        Inherits Window
        Const dataCount As Integer = 100
        Private data As List(Of DataSourceItem) = New List(Of DataSourceItem)()
        Private Function GenerateDateTimeData() As List(Of DataSourceItem)
            Dim data As List(Of DataSourceItem) = New List(Of DataSourceItem)()
            Dim rand As Random = New Random()
            Dim value As Double = 0
            For i As Integer = 0 To dataCount - 1
                value += (rand.NextDouble() - 0.5)
                data.Add(New DataSourceItem() With {
                    .Argument = TimeSpan.FromMinutes(i * 30),
                    .Value = Math.Abs(value + Math.Sin(i * 0.6))
                })
            Next
            Return data
        End Function
        Public Sub New()
            InitializeComponent()
            Me.DataContext = GenerateDateTimeData()
        End Sub
    End Class
End Namespace