ChartRangeControlClientDateTimeGridOptions.SnapAlignment Property

Specifies the measurement unit to which selection thumbs of the range control are snapped.

Namespace: DevExpress.XtraCharts

Assembly: DevExpress.XtraCharts.v24.1.dll

NuGet Package: DevExpress.Charts

Declaration

C#

[XtraSerializableProperty]
public DateTimeGridAlignment SnapAlignment { get; set; }

VB.NET

<XtraSerializableProperty>
Public Property SnapAlignment As DateTimeGridAlignment

Property Value

Type	Description
DateTimeGridAlignment	A DateTimeGridAlignment enumeration value representing the selection thumbs alignment interval.

Available values:

Name	Description
Millisecond	Specifies a millisecond as the date-time unit to which axis gridlines should be aligned.
Second	Specifies a second as the date-time unit to which axis gridlines should be aligned.
Minute	Specifies a minute as the date-time unit to which axis gridlines should be aligned.
Hour	Specifies an hour as the date-time unit to which axis gridlines should be aligned.
Day	Specifies a day as the date-time unit to which axis gridlines should be aligned.
Week	Specifies a week as the date-time unit to which axis gridlines should be aligned.
Month	Specifies a month as the date-time unit to which axis gridlines should be aligned.
Quarter	Specifies a quarter of a year as the date-time unit to which axis gridlines should be aligned.
Year	Specifies a year as the date-time unit to which axis gridlines should be aligned.

Property Paths

You can access this nested property as listed below:

Object Type	Path to SnapAlignment
ChartRangeControlClientDateTimeOptions	.RangeControlDateTimeGridOptions .SnapAlignment
XYDiagram2D	.RangeControlDateTimeGridOptions .SnapAlignment

Remarks

Use the SnapAlignment property to snap the selection thumbs to the range interval when dragging them in the range control’s viewport.

The image below shows the SnapAlignment property behavior for the date-time measurement unit set to Week.

Example

This example demonstrates how the grid lines and grid snapping of the chart within the range control’s viewport can be customized at runtime.

To access the client options of the chart inside the range control’s viewport, use the RangeControl.ClientOptions property. In this example, the chart control contains data with date-time arguments, so this property returns an object of the ChartRangeControlClientDateTimeOptions type.

To access the grid properties (e.g., ChartRangeControlClientGridOptions.SnapSpacing, ChartRangeControlClientDateTimeGridOptions.SnapAlignment, ChartRangeControlClientGridOptions.GridSpacing and ChartRangeControlClientDateTimeGridOptions.GridAlignment) of the chart range control client, access the ChartRangeControlClientDateTimeGridOptions object using the ChartRangeControlClientDateTimeOptions.RangeControlDateTimeGridOptions property.

Form1.cs

using System;
using System.Windows.Forms;
using DevExpress.XtraCharts;

namespace DateTimeChartRangeControlClient {
    public partial class Form1 : Form {

        const int daysForYear = 30;

        public Form1() {
            InitializeComponent();

            // Call the InitializeChart method. 
            InitializeChart();

            // Specify a Chart control as the Range control client. 
            rangeControl1.Client = chartControl1;

            // Access the date-time grid options of the chart range control client.
            var clientOptions = (ChartRangeControlClientDateTimeOptions)rangeControl1.ClientOptions;
            ChartRangeControlClientDateTimeGridOptions gridOptions = clientOptions.RangeControlDateTimeGridOptions;

            // Specify the manual grid mode of the chart range control client. 
            gridOptions.GridMode = ChartRangeControlClientGridMode.Manual;

            // Customize snap and grid properties of the chart range control client.            
            gridOptions.SnapOffset = 2;
            gridOptions.SnapSpacing = 7;
            gridOptions.SnapAlignment = DateTimeGridAlignment.Day;
            gridOptions.GridSpacing = 7;
            gridOptions.GridAlignment = DateTimeGridAlignment.Day;
            gridOptions.GridOffset = 1;

            // Format labels of the chart range control client.
            gridOptions.LabelFormat = "D";
        }

        void InitializeChart() {

            DateTime baseDate = new DateTime(2000, 1, 1);
            Random rnd = new Random();
            Series series = new Series("Series", ViewType.Bar);

            for (int dayCount = 0; dayCount < daysForYear; dayCount++) {
                DateTime argument = baseDate.AddDays(dayCount);
                double value = rnd.Next(50, 100);
                var seriesPoint = new SeriesPoint(argument, value);
                series.Points.Add(seriesPoint);
            }
            chartControl1.Series.Add(series);
        }
    }
}

Form1.vb

Imports Microsoft.VisualBasic
Imports System
Imports System.Windows.Forms
Imports DevExpress.XtraCharts

Namespace DateTimeChartRangeControlClient
    Partial Public Class Form1
        Inherits Form

        Private Const daysForYear As Integer = 30

        Public Sub New()
            InitializeComponent()

            ' Call the InitializeChart method. 
            InitializeChart()

            ' Specify a Chart control as the Range control client. 
            rangeControl1.Client = chartControl1

            ' Access the date-time grid options of the chart range control client.
            Dim clientOptions = CType(rangeControl1.ClientOptions, ChartRangeControlClientDateTimeOptions)
            Dim gridOptions As ChartRangeControlClientDateTimeGridOptions = clientOptions.RangeControlDateTimeGridOptions

            ' Specify the manual grid mode of the chart range control client. 
            gridOptions.GridMode = ChartRangeControlClientGridMode.Manual

            ' Customize snap and grid properties of the chart range control client.            
            gridOptions.SnapOffset = 2
            gridOptions.SnapSpacing = 7
            gridOptions.SnapAlignment = DateTimeGridAlignment.Day
            gridOptions.GridSpacing = 7
            gridOptions.GridAlignment = DateTimeGridAlignment.Day
            gridOptions.GridOffset = 1

            ' Format labels of the chart range control client.
            gridOptions.LabelFormat = "D"
        End Sub

        Private Sub InitializeChart()

            Dim baseDate As New DateTime(2000, 1, 1)
            Dim rnd As New Random()
            Dim series As New Series("Series", ViewType.Bar)

            For dayCount As Integer = 0 To daysForYear - 1
                Dim argument As DateTime = baseDate.AddDays(dayCount)
                Dim value As Double = rnd.Next(50, 100)
                Dim seriesPoint = New SeriesPoint(argument, value)
                series.Points.Add(seriesPoint)
            Next dayCount
            chartControl1.Series.Add(series)
        End Sub
    End Class
End Namespace