@page "/column-chart"

<RadzenText TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    Radzen Blazor Chart column series
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Visualize data comparisons using vertical column charts.
</RadzenText>

<RadzenText TextStyle="TextStyle.Subtitle2" TagName="TagName.P" class="rz-pb-4">
    In this demo three charts show quarterly revenue comparisons: <strong>auto-size columns</strong>, <strong>custom width columns</strong> (<code>Width="20"</code>), and <strong>range fill columns</strong> using <code>FillRange</code> to color columns red (less than $275k), orange (between $275k-$324k), or green (greater than $324k).
</RadzenText>

<RadzenExample ComponentName="Chart" Example="ColumnChartConfig" DocumentationLink="https://blazor.radzen.com/docs/guides/components/chart.html">
    <ColumnChartConfig />
</RadzenExample>
