RangeAreaSeries2D Class

The 2D Range Area series.

Namespace: DevExpress.Xpf.Charts

Assembly: DevExpress.Xpf.Charts.v19.1.dll

Declaration

C#

public class RangeAreaSeries2D :
    XYSeries2D,
    ISupportTransparency,
    ISupportSeriesBorder,
    ISupportBottomSeriesBorder,
    IGeometryHolder

VB.NET

Public Class RangeAreaSeries2D
    Inherits XYSeries2D
    Implements ISupportTransparency,
               ISupportSeriesBorder,
               ISupportBottomSeriesBorder,
               IGeometryHolder

Example

The following example demonstrates how to create a Range Area chart. To do this, it is necessary to assign the ChartControl.Diagram property to XYDiagram2D, and then add a RangeAreaSeries2D object with points to the diagram’s Diagram.Series collection.

Also, this example shows how to add a chart title and to hide markers and labels for both series to improve the chart’s appearance.

Note

A complete sample project is available at https://github.com/DevExpress-Examples/how-to-create-a-2d-range-area-chart-e3504.

MainWindow.xaml

<Window x:Class="RangeArea2DChart.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/charts"
        Title="MainWindow" Height="350" Width="640" >
    <Grid>
        <dxc:ChartControl Name="chartControl1">
            <dxc:ChartControl.Diagram>
                <dxc:XYDiagram2D>
                    <dxc:XYDiagram2D.Series>
                        <dxc:RangeAreaSeries2D DisplayName="2007-2008" ArgumentScaleType="DateTime"
                                               Transparency="0.3" Marker1Visible="False" Marker2Visible="False">
                            <dxc:RangeAreaSeries2D.Points>
                                <dxc:SeriesPoint Argument="01/01/2008" Value="2.08" dxc:RangeAreaSeries2D.Value2="4.28"/>
                                <dxc:SeriesPoint Argument="02/01/2008" Value="2.42" dxc:RangeAreaSeries2D.Value2="4.03"/>
                                <dxc:SeriesPoint Argument="03/01/2008" Value="2.78" dxc:RangeAreaSeries2D.Value2="3.98"/>
                                <dxc:SeriesPoint Argument="04/01/2008" Value="2.57" dxc:RangeAreaSeries2D.Value2="3.94"/>
                                <dxc:SeriesPoint Argument="05/01/2008" Value="2.69" dxc:RangeAreaSeries2D.Value2="4.18"/>
                                <dxc:SeriesPoint Argument="06/01/2008" Value="2.69" dxc:RangeAreaSeries2D.Value2="5.02"/>
                                <dxc:SeriesPoint Argument="07/01/2008" Value="2.36" dxc:RangeAreaSeries2D.Value2="5.6"/>
                                <dxc:SeriesPoint Argument="08/01/2008" Value="1.97" dxc:RangeAreaSeries2D.Value2="5.37"/>
                                <dxc:SeriesPoint Argument="09/01/2008" Value="2.76" dxc:RangeAreaSeries2D.Value2="4.94"/>
                                <dxc:SeriesPoint Argument="10/01/2008" Value="3.54" dxc:RangeAreaSeries2D.Value2="3.66"/>
                                <dxc:SeriesPoint Argument="11/01/2008" Value="4.31" dxc:RangeAreaSeries2D.Value2="1.07"/>
                                <dxc:SeriesPoint Argument="12/01/2008" Value="4.08" dxc:RangeAreaSeries2D.Value2="0.09"/>
                            </dxc:RangeAreaSeries2D.Points>
                            <dxc:RangeAreaSeries2D.Label>
                                <dxc:SeriesLabel Visible="False" />
                            </dxc:RangeAreaSeries2D.Label>
                        </dxc:RangeAreaSeries2D>
                    </dxc:XYDiagram2D.Series>
                    <dxc:XYDiagram2D.AxisX>
                        <dxc:AxisX2D GridLinesVisible="True" DateTimeGridAlignment="Month">
                            <dxc:AxisX2D.Range>
                                <dxc:AxisRange SideMarginsEnabled="False" />
                            </dxc:AxisX2D.Range>
                            <dxc:AxisX2D.DateTimeOptions>
                                <dxc:DateTimeOptions Format="Custom" FormatString="MMMM" />
                            </dxc:AxisX2D.DateTimeOptions>
                        </dxc:AxisX2D>
                    </dxc:XYDiagram2D.AxisX>
                    <dxc:XYDiagram2D.AxisY>
                        <dxc:AxisY2D>
                            <dxc:AxisY2D.Range>
                                <dxc:AxisRange MinValue="-0.5" MaxValue="6" />
                            </dxc:AxisY2D.Range>
                            <dxc:AxisY2D.Title>
                                <dxc:AxisTitle Content="Inflation rate, %"  />
                            </dxc:AxisY2D.Title>
                        </dxc:AxisY2D>
                    </dxc:XYDiagram2D.AxisY>
                </dxc:XYDiagram2D>
            </dxc:ChartControl.Diagram>
            <dxc:ChartControl.Titles>
                <dxc:Title Dock="Top" HorizontalAlignment="Center">Annual Inflation in 2007 and 2008</dxc:Title>
            </dxc:ChartControl.Titles>
        </dxc:ChartControl>
    </Grid>
</Window>

Related GitHub Examples

The following code snippet (auto-collected from DevExpress Examples) contains a reference to the RangeAreaSeries2D class.

Note

The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

C#

how-to-generate-series-of-different-view-types-using-the-mvvm-binding-style-t500832/VB/MvvmChart/MainWindow.xaml#L21

<DataTemplate>
    <dxc:RangeAreaSeries2D DataSource="{Binding Data}"
                   ArgumentDataMember="Date"

Implements

ILegendVisible

ISupportTransparency

Inheritance

Show 13 items

Object

DispatcherObject

DependencyObject

Visual

UIElement

FrameworkElement

Control

ChartElementBase

ChartElement

Series

XYSeries

XYSeries2D

RangeAreaSeries2D

Extension Methods

GetErrorOperationCommands(Position)

GetErrorOperationCommands(Int32)

GetErrorOperationCommands(Point)