I am creating a column chart. I would like the bars in the chart to be thinner and spaced out like this:
But mine looks like this:
How do I make the bars thinner and spaced out like the first image? I tried setting the RadzenColumnOptions Margin property, but it has no effect.
I achieved the following result with these settings.
<RadzenChart style="width: 500px">
<RadzenColumnSeries Data="@revenue2020" CategoryProperty="Quarter" Title="2020" LineType="LineType.Dashed" ValueProperty="Revenue" />
<RadzenColumnSeries Data="@revenue2019" CategoryProperty="Quarter" Title="2019" ValueProperty="Revenue" />
<RadzenColumnOptions Radius="10" />
<RadzenValueAxis Formatter="@FormatAsUSD">
<RadzenGridLines Visible="true" />
<RadzenAxisTitle Text="Revenue in USD" />
</RadzenValueAxis>
</RadzenChart>
Bottom border radius is not supported though.
If you have only one column series still will show the fat bars. Is there anyway to set the bar width? Thanks
This from you in another post answer my question.
"You cannot set the series with in pixels. RadzenChart dynamically calculates it based on the chart width, number of series and categories."
Did you figure this out? I'm stuck on the same issue. Fat bars that are connected, not a nice visual.
I fixed it using an empty collection (@filler) as a 2nd data set:
<RadzenColumnSeries Data="@revenueByDay" CategoryProperty="Date" ValueProperty="Revenue" LineType="LineType.Dashed" />
<RadzenColumnSeries Data="@filler" CategoryProperty="Date" ValueProperty="Revenue">
At the moment setting the width of the chart is the only way to make the bars smaller. We will introduce a property that would allow you to set custom width in pixels something like <RadzenColumnOptions Width="50" />
