I am trying to use WinRTXamlToolkit.Controls.DataVisualization.UWP
trying to draw any of the stacked charts like this:
But only this comes out:
Since I don't know how you define the code behind, I just provide the sample code as follows which can create a StackedLineSeries
chart successfully.
XAML Code
<Page
x:Class="CStackLineChat.MainPage"
...
xmlns:charting="using:WinRTXamlToolkit.Controls.DataVisualization.Charting"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Padding="50" >
<charting:Chart x:Name="MyChart" Title="Stacked column Chart">
<charting:StackedLineSeries>
<charting:StackedLineSeries.SeriesDefinitions>
<charting:SeriesDefinition
DependentValuePath="Amount"
IndependentValuePath="Name"
IsTapEnabled="True"
Title="Doodad" />
<charting:SeriesDefinition
Title="Stan2"
DependentValuePath="Amount"
IndependentValuePath="Name"/>
</charting:StackedLineSeries.SeriesDefinitions>
</charting:StackedLineSeries>
</charting:Chart>
</Grid>
</Page>
Code behind
public sealed partial class MainPage : Page
{
private Random _random = new Random();
List<NameValueItem> Records = new List<NameValueItem>();
List<NameValueItem> Records2 = new List<NameValueItem>();
public MainPage()
{
this.InitializeComponent();
for (int i = 0; i < 5; i++)
{
Records.Add(new NameValueItem { Name = "Name" + i, Amount = _random.Next(10, 100) });
Records2.Add(new NameValueItem { Name = "Name" + i, Amount = _random.Next(10, 100) });
}
this.RunIfSelected(this.MyChart, () => ((StackedLineSeries)this.MyChart.Series[0]).SeriesDefinitions[0].ItemsSource = Records);
this.RunIfSelected(this.MyChart, () => ((StackedLineSeries)this.MyChart.Series[0]).SeriesDefinitions[1].ItemsSource = Records2);
}
private void RunIfSelected(UIElement element, Action action)
{
action.Invoke();
}
}
public class NameValueItem
{
public string Name { get; set; }
public int Amount { get; set; }
}
And the result
Additionally, by testing on my side, it seems like DependentValuePath
and IndependentValuePath
properties can not directly binding in your scenario. The best way to use this package is to follow the official sample. Here is the chart sample.