0

I have been trying out the charting controls in the WinRT XAM Toolkit (https://winrtxamltoolkit.codeplex.com).

I was able to find some examples and cobble together a working line graph, but I was hoping to be able to make a stacked area chart. Unfortunately al I have managed to get is a single dot in the corner of a blank rectangle.

Lets say I have data for Alice and Bob over that has Date and Balance. I want to see a graph like this:-

enter image description here

So I can make a single set of lines using the following xaml and it works.

<charting:Chart Height="400" Width="800">
    <charting:Chart.Series>
        <charting:LineSeries Title="Alice"
                             ItemsSource="{Binding DataForAlicePlusBob}"
                             IndependentValuePath="Date"
                             DependentValuePath="Balance"
                             />
        <charting:LineSeries Title="Bob"
                             ItemsSource="{Binding DataForBob}"
                             IndependentValuePath="Date"
                             DependentValuePath="Balance"
                             />
    </charting:Chart.Series>
</charting:Chart>

But try as I might I can't figure out how to stack Alice's data on top of Bob's to make the graph I'm after. This is as far as I've gotten, but it just displays a single dot, with no axis.

<charting:Chart Height="400" Width="800">
    <charting:Chart.Series>

        <charting:StackedAreaSeries>
            <charting:StackedAreaSeries.SeriesDefinitions>
                <charting:SeriesDefinition Title="Alice"
                                           ItemsSource="{Binding DataForAlice}"
                                           IndependentValuePath="Date"
                                           DependentValuePath="Balance"
                                           />
                <charting:SeriesDefinition Title="Bob"
                                           ItemsSource="{Binding DataForBob}"
                                           IndependentValuePath="Date"
                                           DependentValuePath="Balance"
                                           />
            </charting:StackedAreaSeries.SeriesDefinitions>
        </charting:StackedAreaSeries>
    </charting:Chart.Series>
</charting:Chart>
Mat Fergusson
  • 320
  • 2
  • 10
  • That's an interesting question. Seems like the samples I ported from Silverlight Toolkit didn't include one for `StackedAreaSeries`, so maybe it doesn't even work. I'll file an issue to track it. – Filip Skakun Jun 19 '15 at 19:35

1 Answers1

0

Just remove the tag <charting:Chart.Series>

This is how i made the StackedAreaSeries work:

<charting:Chart Grid.Row="1" Name="IssuesChart" Width="600" Height="400">
      <charting:StackedAreaSeries>
         <charting:StackedAreaSeries.SeriesDefinitions>
            <charting:SeriesDefinition ItemsSource="{Binding DataForAlice}" 
                                       Title="Loading Failures" 
                                       IndependentValuePath="Date" 
                                       DependentValuePath="Balance"/>

            <charting:SeriesDefinition ItemsSource="{Binding DataForBob}" 
                                       Title="Ingestion Failures" 
                                       IndependentValuePath="Date" 
                                       DependentValuePath="Balance"/>
          </charting:StackedAreaSeries.SeriesDefinitions>
       </charting:StackedAreaSeries>
</charting:Chart>
SebD
  • 16
  • 2