Unplanned
Last Updated: 06 May 2022 08:20 by ADMIN
Tinus
Created on: 29 Apr 2022 17:10
Category: Chart
Type: Feature Request
1
Nested Property Support on Android

Hi Team,

Currently on Android, the Chart renderers do not setup the XValueBinding and YValueBinding correctly if the property name is a nested property. This results in an UnhandledException at runtime

You can reproduce the issue using .NET MAUI RC2 and Telerik UI for MAUI 0.8.0, with the following implementation:

  1. Create a File > New .NET MAUI RC2 project (VS 2022 Preview 5)
  2. Setup MainPage using the following code

XAML

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:telerikChart="clr-namespace:Telerik.XamarinForms.Chart;assembly=Telerik.Maui.Controls.Compatibility"
             x:Class="MauiApp1.MainPage">

    <telerikChart:RadCartesianChart MinimumHeightRequest="300">
        <telerikChart:RadCartesianChart.HorizontalAxis>
            <telerikChart:NumericalAxis LabelFitMode="MultiLine" />
        </telerikChart:RadCartesianChart.HorizontalAxis>
        <telerikChart:RadCartesianChart.VerticalAxis>
            <telerikChart:NumericalAxis />
        </telerikChart:RadCartesianChart.VerticalAxis>

        <telerikChart:RadCartesianChart.Series>
            <telerikChart:ScatterSplineSeries XValueBinding="NumericalData.XData" YValueBinding="NumericalData.YData" ItemsSource="{Binding Data1}" />
        </telerikChart:RadCartesianChart.Series>
    </telerikChart:RadCartesianChart>
</ContentPage>

Code-behind

namespace MauiApp1;

using System.Collections.ObjectModel;

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
        Data1 = GetNumericData1();
        BindingContext = this;
    }
    
    public ObservableCollection<Item> Data1 { get; set; }
    
    public static ObservableCollection<Item> GetNumericData1()
    {
        var data = new ObservableCollection<Item>
        {
            new Item { NumericalData = new NumericalData { XData = 2, YData = 13 } },
            new Item { NumericalData = new NumericalData { XData = 19, YData = 31 } },
            new Item { NumericalData = new NumericalData { XData = 22, YData = 33 } },
            new Item { NumericalData = new NumericalData { XData = 28, YData = 35 } },
            new Item { NumericalData = new NumericalData { XData = 33, YData = 46 } },
            new Item { NumericalData = new NumericalData { XData = 38, YData = 34 } },
            new Item { NumericalData = new NumericalData { XData = 49, YData = 66 } },
            new Item { NumericalData = new NumericalData { XData = 55, YData = 24 } },
            new Item { NumericalData = new NumericalData { XData = 62, YData = 41 } },
        };
        return data;
    }
}

public class NumericalData
{
    public double XData { get; set; }
    public double YData { get; set; }
}

public class Item
{
    public NumericalData NumericalData { get; set; }
}

Thank you!

Martin

1 comment
ADMIN
Yana
Posted on: 06 May 2022 08:20

Hello Martin,

Indeed, for the time being, Chart control does not support nested properties binding for its series - an exception is raised both on Android and iOS and this is related more to the native Android and iOS Chart controls we're internally using.

This is definitely a valid feature request, so I added it to our backlog. I am sorry for any inconvenience caused.

Regards,
Yana
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.