RadzenColumnSeries<TItem> Class

A chart series that displays data as vertical columns (bars) in a RadzenChart. RadzenColumnSeries is ideal for comparing values across categories or showing trends over time with discrete data points. Renders vertical rectangles where the height represents the data value. Multiple column series in the same chart are displayed side-by-side for each category. Supports fill color/stroke color/width customization with individual column colors via Fills/Strokes, dynamic coloring based on value ranges using FillRange and StrokeRange, optional value labels on top of columns, interactive tooltips showing category/value/series name, and click event handling for drill-down scenarios. Use CategoryProperty to specify the X-axis field and ValueProperty for the column height (Y-axis value).

Inheritance

Object

ComponentBase

RadzenChartComponentBase

CartesianSeries<TItem>

RadzenColumnSeries<TItem>

Implements

IComponent

IHandleEvent

IHandleAfterRender

IChartSeries

IChartColumnSeries

Inherited Members

CartesianSeries<TItem>.RequireChart

CartesianSeries<TItem>.ComposeCategory

CartesianSeries<TItem>.ComposeValue

CartesianSeries<TItem>.IsValueNullable

CartesianSeries<TItem>.GetRawValueGetter

CartesianSeries<TItem>.IsDate

CartesianSeries<TItem>.IsNumeric

CartesianSeries<TItem>.GetCategories

CartesianSeries<TItem>.TransformCategoryScale

CartesianSeries<TItem>.TransformValueScale

CartesianSeries<TItem>.RenderOverlays

CartesianSeries<TItem>.SetParametersAsync

CartesianSeries<TItem>.Initialize

CartesianSeries<TItem>.MeasureLegend

CartesianSeries<TItem>.InsidePolygon

CartesianSeries<TItem>.RenderTooltip

CartesianSeries<TItem>.RenderSharedTooltipItem

CartesianSeries<TItem>.GetTooltipPosition

CartesianSeries<TItem>.TooltipClass

CartesianSeries<TItem>.RenderLegendItem

CartesianSeries<TItem>.GetMedian

CartesianSeries<TItem>.GetMean

CartesianSeries<TItem>.GetMode

CartesianSeries<TItem>.GetTrend

CartesianSeries<TItem>.GetTitle

CartesianSeries<TItem>.TooltipLabel

CartesianSeries<TItem>.TooltipTitle

CartesianSeries<TItem>.TooltipValue

CartesianSeries<TItem>.PickColor

CartesianSeries<TItem>.Dispose

CartesianSeries<TItem>.InvokeClick

CartesianSeries<TItem>.Title

CartesianSeries<TItem>.ChildContent

CartesianSeries<TItem>.TooltipTemplate

CartesianSeries<TItem>.Overlays

CartesianSeries<TItem>.CoordinateSystem

CartesianSeries<TItem>.CategoryProperty

CartesianSeries<TItem>.Visible

CartesianSeries<TItem>.Hidden

CartesianSeries<TItem>.ShowInLegend

CartesianSeries<TItem>.ValueProperty

CartesianSeries<TItem>.RenderingOrder

CartesianSeries<TItem>.Data

CartesianSeries<TItem>.Items

CartesianSeries<TItem>.Markers

CartesianSeries<TItem>.MarkerType

CartesianSeries<TItem>.MarkerSize

RadzenChartComponentBase.ShouldRefreshChart

RadzenChartComponentBase.ValidateParameters

RadzenChartComponentBase.DidParameterChange

RadzenChartComponentBase.Chart

ComponentBase.OnInitialized

ComponentBase.OnInitializedAsync

ComponentBase.OnParametersSet

ComponentBase.OnParametersSetAsync

ComponentBase.StateHasChanged

ComponentBase.ShouldRender

ComponentBase.OnAfterRender

ComponentBase.OnAfterRenderAsync

ComponentBase.InvokeAsync

ComponentBase.DispatchExceptionAsync

ComponentBase.RendererInfo

ComponentBase.Assets

ComponentBase.AssignedRenderMode

Namespace: Radzen.Blazor

Assembly: Radzen.Blazor.dll

Syntax

public class RadzenColumnSeries<TItem> : CartesianSeries<TItem>, IComponent, IHandleEvent, IHandleAfterRender, IChartSeries, IChartColumnSeries

Type Parameters

Name Description
TItemThe type of data items in the series. Each item represents one column in the chart.

Examples

Basic column series:

<RadzenChart>
    <RadzenColumnSeries Data=@revenue CategoryProperty="Quarter" ValueProperty="Amount" Title="Revenue" />
</RadzenChart>

Multiple column series with custom colors:

<RadzenChart>
    <RadzenColumnSeries Data=@sales2023 CategoryProperty="Month" ValueProperty="Total" Title="2023" Fill="#4169E1" />
    <RadzenColumnSeries Data=@sales2024 CategoryProperty="Month" ValueProperty="Total" Title="2024" Fill="#32CD32" />
</RadzenChart>

Constructors

RadzenColumnSeries<TItem>link

A chart series that displays data as vertical columns (bars) in a RadzenChart. RadzenColumnSeries is ideal for comparing values across categories or showing trends over time with discrete data points. Renders vertical rectangles where the height represents the data value. Multiple column series in the same chart are displayed side-by-side for each category. Supports fill color/stroke color/width customization with individual column colors via Fills/Strokes, dynamic coloring based on value ranges using FillRange and StrokeRange, optional value labels on top of columns, interactive tooltips showing category/value/series name, and click event handling for drill-down scenarios. Use CategoryProperty to specify the X-axis field and ValueProperty for the column height (Y-axis value).

Declaration
public RadzenColumnSeries<TItem>()

Properties

Colorlink

Declaration
public string Color { get; }
Property Value
Type Description
string

Filllink

Gets or sets the fill (background) color applied to all columns in the series. Supports any valid CSS color value. If not set, uses the color scheme's default color.

Declaration
public string Fill { get; set; }
Property Value
Type Description
stringGets or sets the fill (background) color applied to all columns in the series. Supports any valid CSS color value. If not set, uses the color scheme's default color.

FillRangelink

Gets or sets value-based color ranges that dynamically color columns based on their values. Allows conditional coloring (e.g., red for negative values, green for positive). Each range specifies a min/max value and a color to apply to columns within that range.

Declaration
public IList<SeriesColorRange> FillRange { get; set; }
Property Value
Type Description
IList<SeriesColorRange>Gets or sets value-based color ranges that dynamically color columns based on their values. Allows conditional coloring (e.g., red for negative values, green for positive). Each range specifies a min/max value and a color to apply to columns within that range.

Fillslink

Gets or sets a collection of fill colors to apply to individual columns in sequence. Each column gets the color at its index position, allowing rainbow or gradient-like effects. Takes precedence over the Fill property.

Declaration
public IEnumerable<string> Fills { get; set; }
Property Value
Type Description
IEnumerable<string>Gets or sets a collection of fill colors to apply to individual columns in sequence. Each column gets the color at its index position, allowing rainbow or gradient-like effects. Takes precedence over the Fill property.

LineTypelink

Gets or sets the line style for column borders (solid, dashed, dotted). Only applicable if stroke is enabled.

Declaration
public LineType LineType { get; set; }
Property Value
Type Description
LineTypeGets or sets the line style for column borders (solid, dashed, dotted). Only applicable if stroke is enabled.

Strokelink

Gets or sets the stroke (border) color applied to all columns in the series. If not set, columns render without borders.

Declaration
public string Stroke { get; set; }
Property Value
Type Description
stringGets or sets the stroke (border) color applied to all columns in the series. If not set, columns render without borders.

StrokeRangelink

Gets or sets value-based color ranges that dynamically color column borders based on their values. Works similarly to FillRange but affects the stroke color instead of fill.

Declaration
public IList<SeriesColorRange> StrokeRange { get; set; }
Property Value
Type Description
IList<SeriesColorRange>Gets or sets value-based color ranges that dynamically color column borders based on their values. Works similarly to FillRange but affects the stroke color instead of fill.

StrokeWidthlink

Gets or sets the width of the column border in pixels. Only visible if Stroke or Strokes is specified.

Declaration
public double StrokeWidth { get; set; }
Property Value
Type Description
doubleGets or sets the width of the column border in pixels. Only visible if Stroke or Strokes is specified.

Strokeslink

Gets or sets a collection of stroke colors to apply to individual column borders in sequence. Each column border gets the color at its index position. Takes precedence over the Stroke property.

Declaration
public IEnumerable<string> Strokes { get; set; }
Property Value
Type Description
IEnumerable<string>Gets or sets a collection of stroke colors to apply to individual column borders in sequence. Each column border gets the color at its index position. Takes precedence over the Stroke property.

Methods

BuildRenderTreelink

Declaration
protected override void BuildRenderTree(Rendering.RenderTreeBuilder __builder)
Parameters
Type Name Description
Rendering.RenderTreeBuilder __builder

Containslink

Declaration
public override bool Contains(double x, double y, double tolerance)
Parameters
Type Name Description
double x
double y
double tolerance
Returns
Type Description
bool

DataAtlink

Declaration
public override ValueTuple<object, Point> DataAt(double x, double y)
Parameters
Type Name Description
double x
double y
Returns
Type Description
ValueTuple<object, Point>

GetDataLabelslink

Declaration
public override IEnumerable<Rendering.ChartDataLabel> GetDataLabels(double offsetX, double offsetY)
Parameters
Type Name Description
double offsetX
double offsetY
Returns
Type Description
IEnumerable<Rendering.ChartDataLabel>

Renderlink

Declaration
public override RenderFragment Render(ScaleBase categoryScale, ScaleBase valueScale)
Parameters
Type Name Description
ScaleBase categoryScale
ScaleBase valueScale
Returns
Type Description
RenderFragment

TooltipStylelink

Declaration
protected override string TooltipStyle(TItem item)
Parameters
Type Name Description
TItem item
Returns
Type Description
string
An error has occurred. This app may no longer respond until reloaded. Reload 🗙