Blazor Toolkit
Overview

The Blazor Scatter Chart is used to visualize the relationship between two numeric values by plotting individual data points. Each point represents a data item positioned using X and Y values, making the Chart useful for identifying correlations, patterns, clusters, and outliers in data analysis scenarios. To create a scatter chart, set the Type property of ChartSeries to ChartSeriesType.Scatter.

Data Label

Data labels display the values of data points directly on the scatter Chart. They help users quickly understand exact values without relying on tooltips and automatically adjust to avoid overlapping, improving readability in analytical and reporting views. To display data labels, add the ChartDataLabel component inside the ChartMarker and set its Visible property to true.

Customizing Point Shape

The point shape in a Blazor Scatter Chart can be customized using marker shapes such as circle, diamond, rectangle, or triangle. Custom shapes help differentiate multiple series and improve visual clarity when comparing datasets in the same Chart. You can set the shape using the Shape property in the ChartMarker.

Customizing Point Size

The point size can be adjusted by setting the marker height and width. Proper sizing ensures better visibility of data points, especially when working with dense or sparse datasets, and helps maintain a balanced Chart appearance. This is done by configuring the Width and Height properties of the ChartMarker component.

Series Customization

The scatter series can be customized using properties like fill color and opacity. These options help visually distinguish datasets, highlight trends, and align the Chart’s appearance with the application’s theme. Customize the series by setting properties like Fill and Opacity within the ChartSeries component.

Rejoining the server...

Rejoin failed... trying again in seconds.

Failed to rejoin.
Please retry or reload the page.

The session has been paused by the server.

Failed to resume the session.
Please retry or reload the page.