Why didn’t I think of that in the first place? [Windows Phone 7 Charting example updated to include reusable, platform-consistent Style and Templates]


This blog has moved to a new location and comments have been disabled.

All old posts, new posts, and comments can be found on The blog of dlaa.me.

See you there!

Comments (14)
  1. Anonymous says:

    Using your sample code when I change the chart type from a PieSeries to a BarSeries it looks like there is still a gradient effect. Is this by design?

  2. Delay says:

    Anonymous,

    It's by design (i.e., things are working correctly), but it's not by intent (i.e., my comments misleadingly suggested that all gradients would be gone). Specifically, the default Style/Template for BarDataPoint/ColumnDataPoint (used by BarSeries/ColumnSeries) includes a mostly-transparent overlay of the background color that adds the subtle gradient effect that is still present even with the changes I discuss above for switching to solid background colors. Sorry for not calling that out above!

    The simple fix is to re-Template the DataPoints (via Series.DataPointStyle) to remove this gradient overlay from the Template. However, this task is a bit more involved than what I discuss above – if you want to go all the way like that, you'd really almost want to create a new generic.xaml for the Data Visualization assembly instead. And – when it comes to it – that's exactly what I'll do for the dedicated Windows Phone release of Data Visualization. πŸ™‚

  3. Karan Vohra says:

    I am getting the following error following your blog, when I try to run the mobile application on emulator –

    Invalid attribute value charting:DisplayAxis for property TargetType. [Line: 762 Position: 12]

    The charting control that I have added in MainPage.xaml is as follows –

     <charting:Chart

                   x:Name="myChart"

                   Title="my activity"

                   LegendTitle="legend">

                   <charting:PieSeries

                       ItemsSource="{StaticResource Activities}"

                       DependentValuePath="Count"

                       IndependentValuePath="Activity">

                   </charting:PieSeries>

               </charting:Chart>

    Have you encountered such issue before?

  4. Delay says:

    Karan Vohra,

    Not really. Assuming the sample application works as-is without modification (it *used* to and nobody has claimed it doesn't), you might want to start from there and slowly change it to what you have to see when the problem creeps in.

    One thing that's sometimes hard to track down is if you've missed adding a project reference to the dependent System.Windows.Controls assembly that is used by the Data Visualization assembly. The errors that result from this aren't always clear, so this could be an instance of that problem.

    Good luck! πŸ™‚

  5. mgol says:

    Thank you. Perfect example.

    I would like to get data from WCF service but unfortunately I can not bind chart to my data.

    Do you have any example how I can do it?

  6. Delay says:

    mgol,

    Thanks! πŸ™‚ While I don't have a WCF example myself, it looks like there are one or two in my collection of Data Visualization links that might help get you going: http://cesso.org/r/DVLinks

    Hope this helps!

  7. Cristovão Morgado says:

    How about getting SL4Tollkit working… I'm missing the stacked series πŸ™

  8. Delay says:

    CristovΓ£o Morgado,

    The most recent Silverlight 4 Toolkit (April 2010) includes stacked series support – as does my Developer Release 4 on which the sample above is based. So I'm afraid I don't understand what you're asking for. πŸ™

  9. Depechie says:

    Hey David, is it me, or is it not possible to add tooltips to the charts on Windows Phone 7?

    For example, your tips for the normal silverlight set ( blogs.msdn.com/…/chart-tweaking-made-easy-how-to-make-four-simple-color-tooltip-changes-with-silverlight-wpf-charting.aspx ) is it possible here on the phone?

  10. Delay says:

    Depechie,

    Technically, you can add ToolTips just the same way as on Silverlight – the catch is that Windows Phone 7 has a touch interface and doesn't have the notion of "hover" which is what normally displays ToolTips. (It's the same for iPhone and most other touch interfaces, by the way.) What you might consider is to manually display ToolTips (or something like them) in response to certain touch inputs (quick tap, tap+hold, etc.) – but as for "traditional" ToolTips, you're right that they won't show up by default.

  11. Depechie says:

    Well David, I was looking at that also… but with not much luck, so maybe you have any tips for this too? πŸ˜‰

    The problem I'm currently facing, when I implement a colunmnseries chart, I would love that if the user taps the chart, I'll display the selected value data.

    But when I add a manipulation started event handler or add a guestures listener for Tap, I do get an event with information about the chart, but not what actual column was selected… so I have no idea what data to show.

    If I add the IsSelectionEnabled = true, and add a SelectionChanged handler, I do get the data, but the problem with this solution is that if you have a very low column ( small data ) it's difficult to click on the column itself, so I would rather have the manipulation/gesture solution, so that if the user has his finger above the actual column it will also be selected.

    Well I hope you understand my problem πŸ˜‰

  12. Delay says:

    Depechie,

    I understand your scenario. πŸ™‚ What you might consider is detecting the input on the Chart itself and then mapping that to the corresponding column yourself. Specifically, you can query the Axes to find out what X/Y values were tapped and then figure out the corresponding data value (similar examples here: http://cesso.org/r/DVLinks). Alternatively, you could walk the list of ColumnDataPoint instances under Chart, determine the bounds, and extend them to determine which column region was clicked within. Neither approach is natively supported, but they both seem like they'd be relatively straightforward once you got the right infrastructure in place.

    Hope this helps!

  13. vijay says:

    I am using this to display data which I get dynamically from web service.

    Since I have 6 legends with longer name, I even changed the stack panel to wrap panel which works fine.

    When I update the data the colors in the pie chart change.

    They seem to be cycling through.

    How do I keep the same colors.

    I tried observable collection which did not help.

    Is there a way to reset the pie chart so that we can get the same color.

  14. Delay says:

    vijay,

    Color cycling usually happens because data series keep getting added and removed (vs. replaced). If you want full control over the colors of elements, an approach like the one I show in the following blog post usually works well: blogs.msdn.com/…/columns-of-a-different-color-customizing-the-appearance-of-silverlight-charts-with-re-templating-and-mvvm.aspx

    Hope this helps!

Comments are closed.