DxChartBarSeriesBase<T, TArgument, TValue>.BarWidth Property

Specifies the width of individual bars in the series in pixels.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(null)]
[Parameter]
public int? BarWidth { get; set; }

Property Value

Type	Default	Description
Nullable<Int32>	null	A value that defines the bar width in pixels.

Remarks

The BarWidth property value cannot be greater than the maximum width available for a bar in the bar group. To calculate the maximum width, the chart divides the bar group width by the number of bars in the group. Use the series’s BarPadding property to specify bar padding as a percentage. The BarWidth property has a higher priority than the BarPadding property. Therefore, the BarPadding has no effect when BarWidth is specified.

The following image shows a chart with a bar series whose bar width is set to 10 pixels:

You can use the chart’s BarGroupWidth and BarGroupPadding properties to configure the bar group width in multi-series charts. The BarGroupWidth property has a higher priority in single-series charts if the BarWidth and BarGroupWidth properties are set.

The markup below configures individual series’ bar width, and bar group width:

Razor

<DxChart BarGroupWidth=110>
    @*...*@
    <DxChartBarSeries BarWidth=30>
    </DxChartBarSeries>
    @*...*@
    <DxChartBarSeries BarWidth=30>
    </DxChartBarSeries>
    @*...*@
    <DxChartBarSeries BarWidth=30>
    </DxChartBarSeries>
</DxChart>