BarSeries Class

Displays data as individual bars grouped by arguments, and each bar height is determined by the data value.

Assembly: DevExpress.Maui.Charts.dll

NuGet Package: DevExpress.Maui.Charts

Declaration

public class BarSeries :
    BarSeriesBase

Remarks

Bars

Example #1

The following example creates a bar series, populates it with data, and configures the settings of the y-axis assigned to the series:

DevExpress Charts for .NET MAUI - Volume bars in financial charts

View Example

XAML

<dx:BarSeries DisplayName="Volume">
    <dx:BarSeries.Data>
        <dx:SeriesDataAdapter DataSource="{Binding StockPrices}" ArgumentDataMember="Date">
            <dx:ValueDataMember Type="Value" Member="Volume" />
        </dx:SeriesDataAdapter>
    </dx:BarSeries.Data>

    <dx:BarSeries.HintOptions>
        <dx:SeriesCrosshairOptions PointTextPattern="Volume: ${V$#,###}" />
    </dx:BarSeries.HintOptions>

    <dx:BarSeries.Style>
        <dx:BarSeriesStyle Fill="#ff2196F3"/>
    </dx:BarSeries.Style>

    <dx:BarSeries.AxisY>
        <dx:NumericAxisY>
            <dx:NumericAxisY.LabelValueNotation>
                <dx:AxisLabelEngineeringNotation/>
            </dx:NumericAxisY.LabelValueNotation>
            <dx:NumericAxisY.Layout>
                <dx:AxisLayout Anchor1="0" Anchor2="0.25" />
            </dx:NumericAxisY.Layout>
            <dx:NumericAxisY.DisplayPosition>
                <dx:AxisDisplayPositionNear/>
            </dx:NumericAxisY.DisplayPosition>
            <dx:NumericAxisY.Label>
                <dx:AxisLabel Position="Inside" TextFormat="$#"/>
            </dx:NumericAxisY.Label>
            <dx:NumericAxisY.Style>
                <dx:AxisStyle MajorGridlinesVisible="True"
                               LineColor="#8f2196F3"
                               MajorGridlinesColor="#8f2196F3"/>
            </dx:NumericAxisY.Style>
        </dx:NumericAxisY>
    </dx:BarSeries.AxisY>
</dx:BarSeries>

Example #2

The following example creates a bar series, and colors each point based on the range to which the point belongs:

DevExpress Charts for .NET MAUI - Bar series colored by value ranges

View Example

XAML

<dx:BarSeries LegendTextPattern="{}Profit from {CLV}% to {CHV}%">
    <dx:BarSeries.Data>
        <dx:SeriesDataAdapter 
                DataSource="{Binding CryptocurrencyPortfolioData}"
                ArgumentDataMember="Ticker">
            <dx:ValueDataMember Type="Value" Member="Profit"/>
        </dx:SeriesDataAdapter>
    </dx:BarSeries.Data>

    <dx:BarSeries.Label>
        <dx:BarSeriesLabel Position="Outside" 
                            Behavior="Cut" 
                            TextPattern="{}{V}%"/>
    </dx:BarSeries.Label>

    <dx:BarSeries.PointColorizer>
        <dx:ValueBandPointColorizer>
            <dx:ValueBandPointColorizer.ColorStops>
                <dx:ColorStop Color="Green" Value1="0" Value2="100"/>
                <dx:ColorStop Color="Red" Value1="0" Value2="-100"/>
            </dx:ValueBandPointColorizer.ColorStops>
        </dx:ValueBandPointColorizer>
    </dx:BarSeries.PointColorizer>
</dx:BarSeries>

Example #3

The following example creates a bar series, and colors its points with colors from the palette:

DevExpress Charts for .NET MAUI - Bar series colored with palette colors

View Example

XAML

<dx:BarSeries>
    <dx:BarSeries.Data>
        <dx:SeriesDataAdapter DataSource="{Binding Path=ComponentReplyInfos}" ArgumentDataMember="ComponentName">
            <dx:SeriesDataAdapter.ValueDataMembers>
                <dx:ValueDataMember Type="Value" Member="Count"/>
            </dx:SeriesDataAdapter.ValueDataMembers>
        </dx:SeriesDataAdapter>
    </dx:BarSeries.Data>
    <dx:BarSeries.PointColorizer>
        <dx:ColorEachPointColorizer x:Name="col">
            <dx:ColorEachPointColorizer.Palette>
                <x:Array Type="{x:Type Color}">
                    <Color>#FF8873bf</Color>
                    <Color>#CF8873bf</Color>
                    <Color>#AF8873bf</Color>
                    <Color>#9F8873bf</Color>
                    <Color>#7F8873bf</Color>
                    <Color>#6F8873bf</Color>
                </x:Array>
            </dx:ColorEachPointColorizer.Palette>
        </dx:ColorEachPointColorizer>
    </dx:BarSeries.PointColorizer>
</dx:BarSeries>