Skip to main content

Dot plot chart

info

Charts are available with Avalonia Pro.

Dot plot charts display individual data points as simple dots, so values can be compared across categories without the visual weight of bars.

When to use

  • Value comparison: Comparing individual values across multiple categories without bar clutter.
  • Frequency distribution: Showing how often specific values occur within a dataset.
  • Small datasets: When precise positioning of each data point matters more than aggregate shape.

Code example

XAML

<charts:CartesianChart Title="Employee Ratings" Height="250">
<charts:CartesianChart.HorizontalAxis>
<charts:CategoryAxis />
</charts:CartesianChart.HorizontalAxis>
<charts:CartesianChart.VerticalAxis>
<charts:NumericalAxis />
</charts:CartesianChart.VerticalAxis>
<charts:CartesianChart.Series>
<charts:DotPlotSeries Title="Ratings"
ItemsSource="{Binding RatingData}"
CategoryPath="Department"
ValuePath="Score"
DotSize="12"
ShowConnectorLines="True" />
</charts:CartesianChart.Series>
</charts:CartesianChart>

Data model (C#)

public record RatingItem(string Department, double Score);

public ObservableCollection<RatingItem> RatingData { get; } = new()
{
new("Engineering", 4.5),
new("Marketing", 3.8),
new("Sales", 4.1),
new("Support", 3.5),
new("Design", 4.3)
};

Common properties

PropertyDescriptionDefault
TitleThe name of the series shown in the legend.null
ItemsSourceThe collection of data items to display.null
CategoryPathPath to the property used for the X-axis.null
ValuePathPath to the property used for the Y-axis.null
FillThe color/brush used to fill the dots.Theme-dependent
StrokeThe outline color of the dots.Transparent
DotSizeThe size of each dot in pixels.10
ShowConnectorLinesWhether to show lines connecting the dots.false
ConnectorThicknessThe thickness of the connector lines.1

See also