Skip to main content
A newer version of this page is available. .

FunnelSeries2D Class

Represents a series view of the Funnel type.

Namespace: DevExpress.Xpf.Charts

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

Declaration

public class FunnelSeries2D :
    Series

Remarks

The FunnelSeries2D class provides the functionality of a series view of the Funnel Series type within a chart control.

In addition to the common view settings inherited from the base Series class, the FunnelSeries2D class declares the funnel type specific settings, which allow you to enable the auto-calculation of a funnel’s height-to-width ratio (the FunnelSeries2D.HeightToWidthRatio, and FunnelSeries2D.HeightToWidthRatioAuto properties), to control a funnel’s alignment with respect to the position of its labels (the FunnelSeries2D.AlignToCenter property), and a funnel’s appearance (the FunnelSeries2D.Border and FunnelSeries2D.ActualBorder properties).

For more information, refer to Funnel Series.

Example

The following example demonstrates how to create a 2D Funnel chart.

For this, it’s necessary to create a ChartControl, choose a SimpleDiagram2D object as its diagram and put FunnelSeries2D into its SeriesCollection. Each point of a funnel series should contain an argument and a value.

Note that in this sample the label’s SeriesLabel.TextPattern and Series.LegendTextPattern properties are set to “{}{A}: {VP: ##.##%}”, which allows showing a point’s argument and its percentage value separated by a colon. The available placeholders are detailed below.

  • {A} - Use it to display a series point’s arguments.
  • {VP} - Use it to display a series point’s values as percent.
  • {S} - Use it to display the series name.
<Window
        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" 
        x:Class="FunnelChart.MainWindow"
        Title="MainWindow" Height="650" Width="900">
    <Grid>
        <dxc:ChartControl>
            <dxc:ChartControl.Diagram>
                <dxc:SimpleDiagram2D>
                    <dxc:FunnelSeries2D LegendTextPattern="{}{A}: {VP: ##.##%}" 
                                    HeightToWidthRatioAuto="False" HeightToWidthRatio="0.9" 
                                    PointDistance="2">
                        <dxc:SeriesPoint Argument="Visited a Web Site" Value="9152" />
                        <dxc:SeriesPoint Argument="Downloaded a Trial" Value="6870" />
                        <dxc:SeriesPoint Argument="Contacted to Support" Value="5121" />
                        <dxc:SeriesPoint Argument="Subscribed" Value="2224" />
                        <dxc:SeriesPoint Argument="Renewed" Value="1670" />
                        <dxc:FunnelSeries2D.Label>
                            <dxc:SeriesLabel Visible="True" TextPattern="{}{A}: {VP: ##.##%}"                                         
                                        dxc:FunnelSeries2D.LabelPosition="Center"/>
                        </dxc:FunnelSeries2D.Label>
                        <dxc:FunnelSeries2D.Titles>
                            <dxc:Title Dock="Top" HorizontalAlignment="Center"
                                   FontSize="24">Web Site Visitor Trend</dxc:Title>
                        </dxc:FunnelSeries2D.Titles>
                    </dxc:FunnelSeries2D>
                </dxc:SimpleDiagram2D>
            </dxc:ChartControl.Diagram>
            <dxc:ChartControl.Legend>
                <dxc:Legend/>
            </dxc:ChartControl.Legend>
        </dxc:ChartControl>
    </Grid>
</Window>

The following code snippet (auto-collected from DevExpress Examples) contains a reference to the FunnelSeries2D 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.

Implements

See Also