Simple LineSeries Chart not displaying

[Tom]

Hello all, I'm fairly new to MVVM. I can run the demonstration project and it works, but I cannot seem to get my own simple lineSeries chart up and running in a new project. I cannot figure out why my chart isn't doing anything - when I run my application nothing is displayed, I cannot see the chart, despite in the designer the selectable bounding box appearing in the center of the page. Below is my code:

MainPage.xaml:

<Page

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:local="using:SyncTest"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    xmlns:Charts="using:Syncfusion.UI.Xaml.Charts"

    x:Class="SyncTest.MainPage"

    mc:Ignorable="d">

    <Grid Background="Wheat">

        <Page DataContext="UsersViewModel" />

        <Charts:SfChart HorizontalAlignment="Left" Height="449" Margin="194,139,0,0" VerticalAlignment="Top" Width="949" x:Name="test">

            <Charts:LineSeries

                ItemsSource="{Binding UsersList}"

                XBindingPath="TimeStamp"

                YBindingPath="NoOfUsers">

            </Charts:LineSeries>

        </Charts:SfChart>

    </Grid>

</Page>

Code behind (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;

using System.Collections;

using System.Collections.ObjectModel;

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

namespace SyncTest

{

    /// <summary>

    /// An empty page that can be used on its own or navigated to within a Frame.

    /// </summary>

    public sealed partial class MainPage : Page

    {

        UsersViewModel uvm;

        public MainPage()

        {

            this.InitializeComponent();

            uvm = new UsersViewModel();

            test.Series[0].ItemsSource = uvm.UsersList;

        }

    }

    public class UserProfile

    {

        public DateTime TimeStamp { get; set; }

        public double NoOfUsers { get; set; }

    }

    public class UsersViewModel

    {

        public UsersViewModel()

        {

            this.UsersList = new ObservableCollection<UserProfile>();

            DateTime date = DateTime.Today;

            UsersList.Add(new UserProfile

            {

                TimeStamp = date.AddHours(0.5),

                NoOfUsers = 1000

            });

            UsersList.Add(new UserProfile

            {

                TimeStamp = date.AddHours(1),

                NoOfUsers = 5000

            });

            UsersList.Add(new UserProfile

            {

                TimeStamp = date.AddHours(1.5),

                NoOfUsers = 3000

            });

            UsersList.Add(new UserProfile

            {

                TimeStamp = date.AddHours(2),

                NoOfUsers = 4000

            });

            UsersList.Add(new UserProfile

            {

                TimeStamp = date.AddHours(2.5),

                NoOfUsers = 2000

            });

            UsersList.Add(new UserProfile

            {

                TimeStamp = date.AddHours(3),

                NoOfUsers = 1000

            });

        }

        public ObservableCollection<UserProfile> UsersList

        {

            get;

            set;

        }

    }

}

I have also tried again, this time following http://help.syncfusion.com/UG/winrt/default.htm#!Documents/lineseries.htm, but no luck

Am I missing some kind of initialiser out? 

Thanks

[Mohammed Azarudeen]

Hi Tom,

 

We have analyzed the reported code and we need to define the DataContext either for Chart directly or for its parent (i.e., its container) in the code snippet as shown below:

 

CodeSnippet[C#]:

<Page.DataContext>

        <local:UsersViewModel></local:UsersViewModel>

    </Page.DataContext>

 

We have prepared the sample by modifying (change DataContext declaration) your code. Please find the sample in the below location.  

                                                                                    

Please let us know if you require further assistance on this.

 

Regards,

Mohammed Azarudeen

Attachment: Chart_6cf902d3.zip