Skip to content

Beta 400

Pre-release
Pre-release
Compare
Choose a tag to compare
@beto-rodriguez beto-rodriguez released this 05 Sep 06:37
· 1448 commits to master since this release
b3f9c38

New Features:

New visuals to Axes

Now Axes are much more flexible, there are multiple new properties (SubseparatorsPaint, TicksPaint, SubticksPaint and ZeroPaint):

.

// this is just a sample there is missing code, full sample at:
// https://github.com/beto-rodriguez/LiveCharts2/blob/master/samples/ViewModelsSamples/Axes/Style/ViewModel.cs

private static readonly SKColor s_gray = new(195, 195, 195);
private static readonly SKColor s_gray1 = new(160, 160, 160);
private static readonly SKColor s_gray2 = new(90, 90, 90);
private static readonly SKColor s_dark3 = new(60, 60, 60);

new Axis
{
    LabelsPaint = new SolidColorPaint(s_gray),
    SeparatorsPaint = new SolidColorPaint
    {
        Color = s_gray,
        StrokeThickness = 1,
        PathEffect = new DashEffect(new float[] { 3, 3 })
    },
    SubseparatorsPaint = new SolidColorPaint
    {
        Color = s_gray2,
        StrokeThickness = 0.5f
    },
    ZeroPaint = new SolidColorPaint
    {
        Color = s_gray1,
        StrokeThickness = 2
    },
    TicksPaint = new SolidColorPaint
    {
        Color = s_gray,
        StrokeThickness = 1.5f
    },
    SubticksPaint = new SolidColorPaint
    {
        Color = s_gray,
        StrokeThickness = 1
    }
}

This is also useful to build cleaner multi-axes charts:

image

// full code at:
// https://github.com/beto-rodriguez/LiveCharts2/blob/master/samples/ViewModelsSamples/Axes/Multiple/ViewModel.cs

Visual elements are back to v2

With this feature we can draw any shape to the chart and scale them using the chart scale (pixels is also supported), it is also useful to add comments or notes to a chart, the API is simple, there is going to be a better sample in the site, but at this point you can browse the source code of this sample (link below).

.

// full code at:
// https://github.com/beto-rodriguez/LiveCharts2/blob/master/samples/ViewModelsSamples/General/VisualElements/ViewModel.cs

public IEnumerable<ChartElement<SkiaSharpDrawingContext>> VisualElements { get; set; } = new List<ChartElement<SkiaSharpDrawingContext>>
{
     new GeometryVisual<RectangleGeometry>
     {
         X = 2.5,
         Y = 3.5,
         LocationUnit = MeasureUnit.ChartValues,
         Width = 4,
         Height = 2,
         SizeUnit = MeasureUnit.ChartValues,
         Fill = new SolidColorPaint(new SKColor(239, 83, 80, 50)) { ZIndex = 10 },
         Stroke = new SolidColorPaint(new SKColor(239, 83, 80)) { ZIndex = 10, StrokeThickness = 1.5f },
     },
     new GeometryVisual<OvalGeometry>
     {
         X = 5.5,
         Y = 6,
         LocationUnit = MeasureUnit.ChartValues,
         Width = 4,
         Height = 5,
         SizeUnit = MeasureUnit.ChartValues,
         Fill = new SolidColorPaint(new SKColor(100, 221, 23, 50)) { ZIndex = - 10 },
         Stroke = new SolidColorPaint(new SKColor(100, 221, 23)) { ZIndex = -10, StrokeThickness = 1.5f },
     },
    // MyGeometry is an SVG icon from google material symbols font:
    // https://github.com/beto-rodriguez/LiveCharts2/blob/master/samples/ViewModelsSamples/General/VisualElements/MyGeometry.cs
     new GeometryVisual<MyGeometry>
     {
         X = 18,
         Y = 6,
         LocationUnit = MeasureUnit.ChartValues,
         Width = 100,
         Height = 100,
         SizeUnit = MeasureUnit.Pixels,
         Fill = new SolidColorPaint(new SKColor(251, 192, 45, 50)) { ZIndex = 10 },
         Stroke = new SolidColorPaint(new SKColor(251, 192, 45)) { ZIndex = 10, StrokeThickness = 1.5f },
     },
     new LabelVisual
     {
         Text = "What happened here?",
         X = 11,
         Y = 1,
         TextSize = 16,
         Paint = new SolidColorPaint(new SKColor(250, 250, 250)) { ZIndex = 11 },
         BackgroundColor = new LvcColor(55, 71, 79),
         Padding = new Padding(12),
         LocationUnit = MeasureUnit.ChartValues,
         Translate = new LvcPoint(0, -35)
     }
};

The library now supports multi-line labels #424

We can finally generate image charts with legends #144

Fixed issues:

Full Changelog: 2.0.0-beta.361...v2.0.0-beta.400