We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Binding the Series collection

Thread ID:

Created:

Updated:

Platform:

Replies:

117093 Aug 8,2014 07:44 PM UTC Jul 28,2017 11:10 AM UTC WPF 20
loading
Tags: Chart
Kevin Kuebler
Asked On August 8, 2014 07:44 PM UTC

I was surprised to find that the Series property of the ChartArea (of type ChartSeriesCollection) is not a dependency property, meaning it can not be data bound. Why is this, and are there any plans to add this capability?

This seems like a very common scenario, where the number of series is not known at design time. I should be able to databind the series collection (you could call the property SeriesSource or something like that to make it separate from the existing Series property if necessary). Then I should be able to provide a DataTemplate for the ChartSeries items in the collection. This would be a standard WPF design for an app following the MVVM pattern. I realize I can add ChartSeries objects to the Series collection manually in the code-behind, but that misses a lot of the point of WPF and MVVM.

Is there something I missed that will actually allow me to do this, or can we expect this in a future release?

Thanks!
Kevin Kuebler

Suresh S [Syncfusion]
Replied On August 11, 2014 12:42 PM UTC

Hi Kevin,


Currently, we don’t have support for binding SeriesCollection property to the ChartArea Series property. Our new SfChart control support this feature. We suggest you to try out our SfChart control for your requirement.


Note: Our new SfChart control can provide you a better performance for large amount of data with few more features included in it. We suggest you to try out our new SfChart control for your requirement.


Documentation link: http://help.syncfusion.com/wpf/sfchart


Regards,

Suresh S


Kevin Kuebler
Replied On August 11, 2014 01:09 PM UTC

Hi Suresh,

Thanks, I didn't know about the new SfChart control. I will check it out!

Kevin

Kevin Kuebler
Replied On August 11, 2014 03:32 PM UTC

So I see that the Series property is now a dependency property, so it can be data bound. That's good. However, I don't see a SeriesTemplate properety (or something similar) to specify a DataTemplate to use for rendering each series. Am I just missing that, or is that not supported? If it's not supported, then I suppose binding the Series requires a value converter to return a new ChartSeriesCollection instance, is that correct?

Also, it doesn't appear that the new chart control supports the ChartZoomingToolkit feature that the old chart had. Is that also correct?

Thanks,
Kevin

Kevin Kuebler
Replied On August 11, 2014 03:38 PM UTC

One more thing ... :-)  It seems that the new chart does not support programmatically controlling the zooming. Is this correct? We are relying on that ability in order to implement selection zooming using the right mouse button, instead of the left (see this forum post: http://www.syncfusion.com/forums/116961/mousedrag-zooming-with-right-mouse-button). As a suggestion, it would be great if you guys could simply add a property to your ChartZoomPanBehavior to control which mouse button is associated with the EnableSelectionZooming feature.

Sheik Syed Abthaheer M [Syncfusion]
Replied On August 12, 2014 04:33 PM UTC

Hi Kavin,

Thanks for your update.

Query 1: I don't see a SeriesTemplate property (or something similar) to specify a DataTemplate to use for rendering each series.

You can achieve your requirement by using CustomTemplate property of Chart Series (Line,Column,StepLine) in SfChart control.

Query 2: Doesn't appear that the new chart control supports the ChartZoomingToolkit feature that the old chart had.

Currently we don’t have ChartZoomingToolkit support in our SfChart and we have already logged feature request for this.

Link: http://www.syncfusion.com/support/directtrac/features/WPF-13632

However we have achieved this feature through workaround in an attached sample.

Query 3: We are relying on that ability in order to implement selection zooming using the right mouse button, instead of the left button.

We have achieved your requirement by inheriting the ChartZoomPanBehavior class. We have prepared the sample based on this and please find the attached sample.

Regards,

M. Sheik


Attachment: SfChart_Zoom_a38dbdb1.zip

Kevin Kuebler
Replied On August 12, 2014 08:15 PM UTC

Thank you for the sample! I have a few follow-up responses below:

1) Specifying a CustomTemplate for the series as you've done in the sample isn't really what I was getting at. The point of binding the Series property would be to not specify an Series elements directly in the XAML of the chart. Instead you would provide a DataTemplate to a SeriesTemplate property, much like with an ItemsControl where you have an ItemsSource that you bind to a list of objects representing each item, and then an ItemTemplate to specify how to render each item in the list. Without that, binding the Series is only usable by providing a ValueConverter to return a SeriesCollection full of series objects created in code. This is ok, but is not much better than doing that in the code-behind. This is not a huge deal, but it would make for a good improvement for the control.

2) This type of solution works fine to replace the functionality of the zooming toolkit.

3) While this solution works on it's own, I don't believe it will work in our case. We can't simply "redirect" the right mouse button events to call the left mouse button event handlers because we have another custom behavior tied to the left mouse button. The behavior we've implemented with the left button is actually kind of a combination of the CrossHair and TrackBall behaviors. It tracks the specific points on the series line, like the TrackBall, but it draws two lines to the point, similar to the CrossHair. Unlike either one though, it is specific to a single series. The user can click on the series line and then it starts tracking for that series. This would be a nice feature to build into the chart also.

Due to these limitations, we will most likely stick with the original chart control for now, but I will keep experimenting with the SfChart control to see if there is a way we can adapt it to our needs.

Thanks,
Kevin

Sheik Syed Abthaheer M [Syncfusion]
Replied On August 13, 2014 04:27 PM UTC

Hi Kevin,


Query 1: Regarding Series Template requirement.

Please provide the simple sample based on this requirement which you have achieved in old chart. So that we will analyze further and check the feasibility in SfChart.


Query 2: Regarding selection zooming using the right mouse button.

We would like to inform you that, in our previous updated sample we have modified the Left mouse button selection zooming into Right mouse button selection zooming. We are disabled Left mouse button event handler only in custom selection behavior (instead of this we use Right mouse button). We are able to use the left mouse button event handler in all other behaviors like cross hair, track ball.


Regards,

M. Sheik


Kevin Kuebler
Replied On August 13, 2014 05:53 PM UTC

Thanks again for your reply.

For 1) I do not have a sample of doing this in the old chart. I think we have a miscommunication. :-) My original question was whether it was possible to bind the Series property. In the old chart, this is not possible because it is not a dependency property. In the SfChart, you can bind Series, however since there is no SeriesTemplate property, you still need to create the series in code using a value converter. What I think SfChart should support is the ability to declaratively specify the chart through binding and templates, without explicitly creating series in either code or XAML (only the template for the series would be in the XAML). This would be in keeping with the spirit of WPF/XAML and the MVVM pattern, much like ItemsControl or ListBox.

Here is an example of what I envision. Imagine you have your product prices broken down by year, and you want a chart with one series for each year. ProductPricesByYear is a collection of objects, one for each year, each of which has a Products collection on it which will represent the data for one series. I suggest we should be able to do something like this ...

<sf:SfChart Series="{Binding ProductPricesByYear}">
    <sf:SfChart.PrimaryAxis>
        <sf:SfChart.CategoryAxis />
    </sf:SfChart.PrimaryAxis>
    <sf:SfChart.SecondaryAxis>
        <sf:SfChart.NumericalAxis/>
    </sf:SfChart.SecondaryAxis>
    <sf:SfChart.SeriesTemplate>
        <DataTemplate>
            <sf:LineSeries XBindingPath="Prodname" YBindingPath="Price" ItemsSource="{Binding Products}" />
        </DataTemplate>
    </sf:SfChart.SeriesTemplate>
</sf:SfChart>

For 2) I see now what you are doing, and it looks like this may in fact work with our other custom behavior we have tied to the left mouse button.

Again, 1) is a suggestion, and an expectation for how I feel the control should work. But I can work around the absence of that feature using a ValueConverter for now. Assuming I can make our other custom behavior work well with the modified ZoomPanBehavior, I should be able to use the SfChart control in our project.

Thanks!
Kevin

Sheik Syed Abthaheer M [Syncfusion]
Replied On August 14, 2014 12:29 PM UTC

Hi Kevin,


Thanks for your update.


We have analyzed your requirement and currently we do not have a support to automatically generate the series using the Series Data Template. We have already considered this type of requirement as a feature. Please find the below feature report link

http://www.syncfusion.com/support/directtrac/features/WRT-2219


Regards,

M. Sheik


Joseph Vianes
Replied On January 30, 2015 12:57 PM UTC

What is the state of this feature ?

I'm trying to use SfChart in a MVVM environment and since it's the UI responsibility to draw series, I don't want to put an object of type ChartSeriesCollection in my ViewModel.

Actually I need to do :
ChartViewModel.cs :
public class ChartViewModel : ItemViewModel
{
    public ChartSeriesCollection series = new ChartSeriesCollection();
    public ChartSeriesCollection Series { get { return series; } }
}
ChartView.xaml :
<sf:SfChart Series="{Binding Series}"/>

What it should be :
namespace Model
{
  public class ValuePoint
  {
      public DateTime Date { get; set; }
      public double Value { get; set; }
  }
  public class Serie
  {
      public string Name { get; set; }
      public IEnumerable<ValuePoint> Values { get; set; }
  }
}
public class ChartViewModel : ItemViewModel
{
    public ObservableCollection<Serie> series = new ObservableCollection<Serie>();
    public ObservableCollection<Serie> Series { get { return series; } }
}
ChartView.xaml :
<sf:SfChart Series="{Binding Series}">
    <sf:SfChart.PrimaryAxis>
        <sf:SfChart.CategoryAxis />
    </sf:SfChart.PrimaryAxis>
    <sf:SfChart.SecondaryAxis>
        <sf:SfChart.NumericalAxis/>
    </sf:SfChart.SecondaryAxis>
    <sf:SfChart.SeriesTemplate>
        <DataTemplate>
            <sf:LineSeries XBindingPath="Date" YBindingPath="Value" ItemsSource="{Binding Values}" Label={Binding Name} />
        </DataTemplate>
    </sf:SfChart.SeriesTemplate>
</sf:SfChart>
Ideally, it should also be possible to add a DataTemplateSelector to dynamically choose between LineSeries / AreaSeries / ...




Rachel A [Syncfusion]
Replied On February 2, 2015 12:45 PM UTC

Hi Kevin,

We would like to let you know that we will implement this feature in any of our upcoming releases. The feature implementation would also greatly depend on the factors such as product design, code compatibility and complexity. We will update you once feature has been implemented. We appreciate your patience until then.

Please let us know, if you need any further assistance.

Thanks,

Rachel. A



Kevin Kuebler
Replied On February 2, 2015 02:42 PM UTC

Hi Rachel,

That's good to hear, thanks for the update! I think that will be a great feature for the chart control.

Thanks,
Kevin

Rachel A [Syncfusion]
Replied On February 4, 2015 04:01 AM UTC

Hi Kevin,

Thanks for the update.

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

Thanks,
Rachel.A

Pavel Filip
Replied On January 20, 2016 08:09 AM UTC

Hello,

when evaluating SyncFusion, I am trying to achieve the same thing as Kevin and Joseph, but to do that, I have to operate the Series collection of the chart in code.
That means, i am passing a new ChartSeries object to the Add method of the Series collection.
I would be very glad, if this could be achieved with Binding, but I am failing to do that.

Did something change or am I doing something wrong?

Thanks,

Pavel


Sumathi Jayaraj [Syncfusion]
Replied On January 21, 2016 01:25 PM UTC

Hi Pavel,

Thanks for contacting Syncfusion support.

We can  populate the chart series collection in code and  can bind  to the “Series” property in SfChart. Please find the sample attachment for your requirement.

Sample: ChartWPFSample


Regards,
Sumathi J

Pavel Filip
Replied On January 22, 2016 02:00 PM UTC

Hello,

your answer helped me do the trick.
Your code revealed the problem.
I was trying to bind to an ObservableCollection<LineSeries>
Instead I should have bound to an object of type ChartSeriesCollection

Magic!
Thanks a lot!!!

Pavel

P.S.: Good news is, that there is one last feature left for me to implement and I am happy to say, that our company is going to buy licenses for SyncFusion :)
To a huge extent thanks to your excellent support you provide!

Sumathi Jayaraj [Syncfusion]
Replied On January 25, 2016 04:29 AM UTC

Hi Pavel,

Thanks for the update. Please let us know if you have any queries.

Regards,
Sumathi J

Devi Aruna Maharasi Murugan [Syncfusion]
Replied On March 27, 2017 10:51 AM UTC

Hi Kevin, 
  
We would like to inform you that, while analyzing for the implementation of this feature (Common ItemsSource for Series), we have found a possible way to achieve this support in sample level. 
  
Kindly refer the below KB link for dynamically generating the series by binding items source directly to chart. 
  
  
Regards, 
Devi 
 


Richard Sinden
Replied On July 27, 2017 09:33 AM UTC

Hi Devi,

This is great, I was just looking for something like this. It sounds like you're planning to put this functionality in the actual SfChart control though. Is there a planned release date for this?

Thanks,

Richard


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;