Radzen Blazor Components

Radzen Blazor Chart

Use the Radzen Blazor Chart component to display data in a graphical format.

Chart Series link

The chart can display area, bar, column, donut, line, and pie data series. The chart series needs data and configuration to tell it which property of the data item is the value of the series (Y axis) and which is the category (X axis).

All series have the following common properties:

Data - specifies the data source which the series should display.

ValueProperty - the name of the property which provides values for the Y axis of the chart. The property should be of numeric type: int, long, float, double, decimal.

CategoryProperty - the name of the property which provides value for the X axis of the chart. The property can be string, Date or numeric. If not set RadzenChart will use the index of the data item as its X axis value.

Basic usage link

Here is a very basic example that creates a column chart with minimal configuration.

The RadzenColumnSeries tag is used to specify that the chart has a column series. The Data property specifies the data source. The chart will render a column for every DataItem instance from the revenue array. The Y (value) axis displays the Revenue property and the X (category) axis displays the Quarter property.

Keyboard Navigation link

The following keys or key combinations provide a way for users to navigate and interact with Radzen Blazor Chart component.

Press this key To do this
Tab Navigate forward across Chart legend items.
Shift + Tab Navigate backward across Chart legend items.
Enter or Space Show/hide the focused Chart legend item serie.

Supercharge your Blazor development with Radzen

Whether you prefer a standalone environment or integration directly within Visual Studio, Radzen provides a powerful toolkit to increase development speed, reduce repetitive coding, and focus on building exceptional applications.

Pro

Radzen Blazor Studio

Radzen Blazor Studio is a software development environment that empowers developers to design, build and deploy Blazor applications without the traditional hurdles.

Learn More
New

Radzen Blazor for Visual Studio

Radzen Blazor for Visual Studio extension streamlines Blazor development within the Visual Studio environment. The Blazor extension you need to boost productivity!

>Radzen Blazor Studio

Radzen Blazor Components, © 2018-2024 Radzen.
Source Code licensed under MIT

Demos Configuration

Premium Themes

  • Material 3
  • Material 3 Dark
  • Fluent
  • Fluent Dark

Free Themes

  • Material
  • Material Dark
  • Standard
  • Standard Dark
  • Default
  • Dark
  • Humanistic
  • Humanistic Dark
  • Software
  • Software Dark
An error has occurred. This app may no longer respond until reloaded. Reload 🗙