Chart - LinseSeries Dynamic

[Marco]

Hi,

I want to fill a chart dynamicaly.

My XAML : (mainpage.xaml)

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Chart="using:Telerik.UI.Xaml.Controls.Chart"
    x:Class="App1.MainPage"
    mc:Ignorable="d"

    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">



    <Hub>
        <HubSection>
            <DataTemplate>
                <Chart:RadCartesianChart HorizontalAlignment="Left" 
                                 Margin="0,0,0,0" 
                                 VerticalAlignment="Top"
                                 Width="350"
                                 Height="400"
                                 x:Name="lineSeries">
            <Chart:RadCartesianChart.HorizontalAxis>
                <Chart:CategoricalAxis/>
            </Chart:RadCartesianChart.HorizontalAxis>
            <Chart:RadCartesianChart.VerticalAxis>
                <Chart:LinearAxis/>
            </Chart:RadCartesianChart.VerticalAxis>

            <Chart:LineSeries ItemsSource="{Binding}"
                              Stroke="Blue"
                              Name="Line1">
                <Chart:LineSeries.CategoryBinding>
                    <Chart:PropertyNameDataPointBinding PropertyName="Category"/>
                </Chart:LineSeries.CategoryBinding>
                <Chart:LineSeries.ValueBinding>
                    <Chart:PropertyNameDataPointBinding PropertyName="Value"/>
                </Chart:LineSeries.ValueBinding>
            </Chart:LineSeries>

            <Chart:LineSeries ItemsSource="{Binding}"
                              Stroke="Red"
                              Name="Line2">
                <Chart:LineSeries.CategoryBinding>
                    <Chart:PropertyNameDataPointBinding PropertyName="Category"/>
                </Chart:LineSeries.CategoryBinding>
                <Chart:LineSeries.ValueBinding>
                    <Chart:PropertyNameDataPointBinding PropertyName="Value"/>
                </Chart:LineSeries.ValueBinding>
            </Chart:LineSeries>


        </Chart:RadCartesianChart>


                </DataTemplate>
            </HubSection>
        </Hub>
</Page>

My c#  (mainpage.xaml.cs)
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238

namespace App1
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();

            this.NavigationCacheMode = NavigationCacheMode.Required;
            List<GData> data1 = new List<GData>();
            data1.Add(new GData() { Category = "Apples", Value = 5 });
            data1.Add(new GData() { Category = "Oranges", Value = 9 });
            data1.Add(new GData() { Category = "Pineaples", Value = 8 });

            this.lineSeries.DataContext = data1;
            List<GData> data2 = new List<GData>();
            data2.Add(new GData() { Category = "Apples", Value = 3 });
            data2.Add(new GData() { Category = "Oranges", Value = 6 });
            data2.Add(new GData() { Category = "Pineaples", Value = 7 });

            this.lineSeries.DataContext = data2;

        }


        protected override void OnNavigatedTo(NavigationEventArgs e)
        {

        }

    }

    public class GData
    {
        public string Category { get; set; }
        public double Value { get; set; }
    }
}

My error :

Error 1 'App1.MainPage' does not contain a definition for 'lineSeries' and no extension method 'lineSeries' accepting a first argument of type 'App1.MainPage' could be found (are you missing a using directive or an assembly reference?)

My question :
What to do to solve this ?



Thx !

[Ves]

Hi Marco,

The chart is not available in the code through its name lineSeries, because it is defined within a DataTemplate, which limits its namescope. Actually, that would be true for any control, not just for the chart. You can find more details here. To solve the issue, you can set DataContext property of the HubSection itself and it will be propagated to the items in it. You can find similar topics discussed in this article.

Best regards,
Ves
Telerik