Binding Data to UWP WinRT_XamlToolKit_Chart

Question

I am trying to load a chart from a DataTemplate in a UWP program using the WinRT_XamlToolkit_Chart library. I am Binding the Chart Title and Data using the {Binding Property} syntax, but it is not loading the property as a data member of the chart object. I have included both my XAML

<Charting:Chart HorizontalAlignment="Center" 
                VerticalAlignment="Center" 
                Width="600" 
                Height="400" 
                DataContext="{Binding}"
                Title="{Binding Title}">
    <Charting:LineSeries Title="{Binding Title}" 
                         Margin="0" 
                         IndependentValuePath="Name" 
                         DependentValuePath="Amount" 
                         IsSelectionEnabled="True" 
                         ItemsSource="{Binding Data}"
                         />
</Charting:Chart>

c# Object

public class DataChartNode : ExperimentNode
{
    public DataChartNode(String title, String type)
    {
        Type = type;
        Title = title;
        Category = "Data Analysis";
    }

    public DataChartNode(String type)
    {
        Type = type;
        Category = "Data Analysis";
        Name = type;
        Title = "Hello";
        Length = 0;
        Data = new List<DataPoint>();
    }

    public DataChartNode() { }

    public string Type { set; get; }
    public string Title { set; get; }
    public int Length { set; get; }
    public List<DataPoint> Data { set; get; }
}

score 0 · Answer 1 · answered Apr 06 '17 at 03:50

Since you didn't provide the DataPoint class and didn't show how you build the data source that you bind to the Chart control, I wrote a simple demo that created the data source code behind which can work well with your XAML code snippet you can reference.

XAML Code (Same with you)

<Charting:Chart
    Title="{Binding Title}"
    Width="600"
    Height="400"
    HorizontalAlignment="Center"
    VerticalAlignment="Center"
    DataContext="{Binding}">
    <Charting:LineSeries
        Title="Title"
        Margin="0"
        DependentValuePath="Amount"
        IndependentValuePath="Name"
        IsSelectionEnabled="True"
        ItemsSource="{Binding Data}" />
</Charting:Chart>

Code behind

public sealed partial class MainPage : Page
{
    private Random _random = new Random();
    public MainPage()
    {
        this.InitializeComponent();
        var data = new List<DataPoint>();         
        for (int i = 0; i < 3; i++)
        {
            data.Add(new DataPoint { Name = "Name" + i, Amount = _random.Next(10, 100) });              
        }
        DataChartNode charnode = new DataChartNode()
        {
            Title = "Hello",
            Data = data
        };          
        this.DataContext = charnode;     
    }
}
public class DataChartNode
{
    public string Type { set; get; }
    public string Title { set; get; }
    public int Length { set; get; }
    public List<DataPoint> Data { set; get; }
}
public class DataPoint
{
    public string Name { get; set; }
    public int Amount { get; set; }      
}

Please check your code behind to find if anything wrong with it.

Binding Data to UWP WinRT_XamlToolKit_Chart

1 Answers1