Back to Devexpress

DxPolarChartBarSeries<T, TArgument, TValue> Class

blazor-devexpress-dot-blazor-dot-dxpolarchartbarseries-3.md

latest7.9 KB
Original Source

DxPolarChartBarSeries<T, TArgument, TValue> Class

Defines a bar series.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
public class DxPolarChartBarSeries<T, TArgument, TValue> :
    DxPolarChartBaseSeries<T, TArgument, TValue>

Type Parameters

NameDescription
T

The data type.

| | TArgument |

The series argument type.

| | TValue |

The series value type.

|

Remarks

The bar series displays data as a collection of bars.

Run Demo: Polar and Radar - Discrete Data

Declare a Bar Series

  1. Use the Polar Chart’s Data property to specify a data source.
  2. Add a <DxPolarChartBarSeries> tag to the component’s markup.
  3. Assign data source fields that contain arguments and values for data points to ArgumentField and ValueField properties.
  4. Optional. Configure the series: customize appearance, add labels, choose selection and hover modes, etc.
razor
<DxPolarChart Data=@DataSource>
    <DxPolarChartBarSeries ArgumentField="@((DiscretePoint i) => i.Arg)"
                           ValueField="@((DiscretePoint i) => i.Day)">
    </DxPolarChartBarSeries>
    <DxChartLegend Visible="false" />
</DxPolarChart>
csharp
namespace BlazorDemo.Data {
    public class DiscretePoint {
        public string Arg { get; set; }
        public int Day { get; set; }
        public int Night { get; set; }

        public DiscretePoint(string arg, int day, int night) {
            Arg = arg;
            Day = day;
            Night = night;
        }
    }
}
csharp
using System.Collections.Generic;
using BlazorDemo.Data;

// ...
    public class ChartDiscreteDataProvider : IChartDiscreteDataProvider {
        public List<DiscretePoint> GenerateData() {
            return new List<DiscretePoint>() {
                new DiscretePoint("January", 6, 2),
                new DiscretePoint("February", 7, 2),
                new DiscretePoint("March", 10, 3),
                new DiscretePoint("April", 14, 5),
                new DiscretePoint("May", 18, 8),
                new DiscretePoint("June", 21, 11),
                new DiscretePoint("July", 22, 13),
                new DiscretePoint("August", 22, 13),
                new DiscretePoint("September", 19, 11),
                new DiscretePoint("October", 15, 8),
                new DiscretePoint("November", 10, 5),
                new DiscretePoint("December", 7, 3),
            };
        }
    }

Nested Component Structure

You can add the following child components to a bar series:

DxChartSeriesLabelDefines a series label.DxChartSeriesLegendItemDefines an item that indicates a series in the legend.DxChartSeriesPointContains settings for points of the chart’s line- and area-based series.

Note that the Polar Chart treats individual bars as points. If you specify the same property at both series and series point levels, the latter has a higher priority.

The following code snippet declares these objects in the markup:

razor
@using System.Drawing

<DxPolarChart Data=@DataSource>
    <DxChartLegend Position="RelativePosition.Outside" />
    <DxPolarChartBarSeries ArgumentField="@((DiscretePoint i) => i.Arg)"
                           ValueField="@((DiscretePoint i) => i.Day)" 
                           Color="Color.Lavender">
        <DxChartSeriesLegendItem Text="Daily Temperature" />
        <DxChartSeriesLabel Visible="true" FormatPattern="{value:##.#}" />
        <DxChartSeriesPoint Color="Color.Blue" />
    </DxPolarChartBarSeries>
</DxPolarChart>

Customize Appearance

The Polar Chart allows you to use the following options to customize a bar series:

BarPaddingSpecifies the padding between bars in a bar group, as a percentage.BarWidthSpecifies the width of an individual bar in the series, in pixels.BreakOnEmptyPointsSpecifies whether the series should break on points with null values.ColorSpecifies the color of the series.MinBarHeightSpecifies the minimum bar height, in pixels.

razor
@using System.Drawing

<DxPolarChart Data=@DataSource>
    <DxPolarChartBarSeries ArgumentField="@((DiscretePoint i) => i.Arg)"
                           ValueField="@((DiscretePoint i) => i.Day)"
                           BarPadding="0.4"
                           Color="Color.Lavender">
    </DxPolarChartBarSeries>
</DxPolarChart>

User Interaction Options

Users can select and hover the mouse pointer over a series and its elements. The table below describes available user interaction options. Since the Polar Chart component treats individual bars as points, the SeriesSelectionMode property is not applicable to a bar series.

DescriptionComponent LevelSeries Level
Hover Over Series and Its ElementsNot ApplicableHoverMode
Point SelectionPointSelectionModeSelectionMode

Implements

IComponent

IHandleEvent

IHandleAfterRender

IDisposable

IPolarChartSeries

IChartSeriesBase

Inheritance

Object ComponentBase DxSettingsComponent<DevExpress.Blazor.Internal.IPolarChartSeriesModel> DxComplexSettingsComponent<DxPolarChartBaseSeries<T, TArgument, TValue>, DevExpress.Blazor.Internal.IPolarChartSeriesModel> DxPolarChartBaseSeries<T, TArgument, TValue> DxPolarChartBarSeries<T, TArgument, TValue> DxPolarChartStackedBarSeries<T, TArgument, TValue>

See Also

DxPolarChartBarSeries<T, TArgument, TValue> Members

DevExpress.Blazor Namespace