Dashed Lines

sample image sample image

Razor

@page "/Design/StrokeDashArray"
@using LiveChartsCore.SkiaSharpView.Blazor
@using LiveChartsCore;
@using LiveChartsCore.SkiaSharpView;
@using LiveChartsCore.SkiaSharpView.Painting;
@using LiveChartsCore.SkiaSharpView.Painting.Effects;
@using SkiaSharp;

<CartesianChart
    Series="@series">
</CartesianChart>

@code {
    private static int[] values = new int[] { 4, 2, 8, 5, 3 };

    private static SolidColorPaint dashedPaint = new SolidColorPaint(new SKColor(0x64, 0x95, 0xED), 10)
    {
        StrokeCap = SKStrokeCap.Round,
        PathEffect = new DashEffect(new float[] { 30, 20 })
    };

    private ISeries[] series = new ISeries[]
    {
        new LineSeries<int>
        {
            Values = values,
            LineSmoothness = 1,
            GeometrySize = 22,
            Stroke = dashedPaint,
            Fill = null
        }
    };
}