MVVM LineGraph DataSource DP

Jul 27, 2009 at 2:08 PM

Hi guys, I have a question regarding DataSource DP of a LineGraph object.

I am working on a WPF project where I am using D3 line graph to display live data comming from a WCF service. I am receiving new data (an array of 1024 Uints) every second or so. I have implemeted DataSource as a CompositeDataSource of 2 EnumerableDataSources (xDataSource and yDataSource). When I receive a new array I simply copy it to yDataSource and fire RaiseDataChanged() event  on yDataSource which updates my graph. It works quite nicely. However, I was looking for a way to databind line graph in XAML to a datasource property of the ViewModel, and let WPF binding framework notify the graph when datasource changes? Do you have an example of something similar to this?

 

Thanks,

Andrey

Editor
Jul 27, 2009 at 3:09 PM

Hi Andrey,

Now we're creating new marker and line chart, where such tasks will be easier to implement. Please, wait a little for a new D3's version :)

 

Best regards,

Mikhail.

 

Jul 27, 2009 at 5:49 PM
Edited Jul 27, 2009 at 5:49 PM

Thanks a lot Mikhail, I'll be eagerly awaiting the new release.

 

Thanks,

Andrey

Editor
Jul 27, 2009 at 6:18 PM

Hi again Andrey,

By the way - you can look at development version of what we are doing here at codeplex - its on 'Source code' page, at the latest changeset, at 'Nightly' dir. We are refreshing now its content from time to time, and there you are able to look at D3 during the process of its development.

If after you look at our sources you have some suggestions, do not hesitate to post the here, they are very usefull for us.

 

P.S. You can contact me if you want at my e-mail - thecentury+d3@gmail.com or at skype: mikhail.brinchuk.

Regards,

Mikhail.

Jul 29, 2009 at 5:19 PM

Mikhail, I'll definitely take a look at the source code tonight. I also added you to my skype as well (my username: Andrey and Alena)

 

Spasibo,

Andrey

Nov 5, 2009 at 4:59 PM

Hi Mikhail,

Quoting Andrey: "I was looking for a way to databind line graph in XAML to a datasource property of the ViewModel, and let WPF binding framework notify the graph when datasource changes? Do you have an example of something similar to this?"

I downloaded the nightly build code but couldn't find an example of that there. Is it ready?

Best regards,

André Carlucci

Editor
Nov 5, 2009 at 5:06 PM

Hi André,

LineGraph has a dependency property DataSource, which you can use in WPF data binding. Also it has some other properties that can be taken by binding from ModelView. That is the way I'm understanding D3's contribution to MVVM. If you need more, please write here your requirements.

Best regards,

Mikhail.

Nov 17, 2009 at 4:45 PM

Great Mikhail, it worked :)

Is there a way to use an ItemsControl or something like that to produce several LineGraphs? I tried to do something like this without success. Any thoughts?

LoadedData is a List<CompositeDataSource>

   <d3:ChartPlotter Name="Chart">
   	<d3:VerticalAxisTitle FontSize="12">Value</d3:VerticalAxisTitle>
         	<d3:HorizontalAxisTitle FontSize="12">Date Time</d3:HorizontalAxisTitle>
                    
                    
         <ItemsControl ItemsSource="{Binding LoadedData}">
         		<ItemsControl.ItemTemplate>
                  		<DataTemplate>
                                <d3:LineGraph DataSource="{Binding}"></d3:LineGraph>
                            </DataTemplate>
                   </ItemsControl.ItemTemplate>
	</ItemsControl>                    
   </d3:ChartPlotter>
Nov 18, 2009 at 2:00 AM
Edited Nov 18, 2009 at 2:02 AM

Hi,

Use line graphs obeservable collection as dependency property like

DependencyProperty LineGraphsProperty = DependencyProperty.Register("LineGraphs", typeof(ObservableCollection<YourViewModel>), typeof(ChartPlotter), new FrameworkPropertyMetadata(new PropertyChangedCallback(ChangeLineGraphs)));

YourViewModel contains PointDataSource or CompositeDataSource etc.

Bind ObservableCollection<YourViewModel> LineGraphs;

If you do LineGraphs.Add(object of YourViewModel) thi will fire linegrphs change dependenccy property event arguments.

in xaml use like

<ddd:ChartPlotter x:Name="plotter" LineGraphs="{Binding Path=LineGraphs}"/>

This will work

Regards

Ravi.

Nov 18, 2009 at 3:10 PM

Hi Ravi,

Thanks for your answer.

I'm just a bit confused, sorry, I'm starting with WPF.

Where the DependencyProperty declaration goes?

And I'm getting this error in the XAML: Error 2 The property 'LineGraphs' was not found in type 'ChartPlotter'.

Any thoughts?
Cheers,

André

 

 

Nov 18, 2009 at 3:41 PM

Just to give more information:

I'm creating a viewer to some timeseries (datetime / value). 60 values per second to be more precise.

The user has a listbox with all timeseries and he/she selects as many as he/she wants and click "show".

The chart should show all selected series. If the user changes his mind, he can select other series and click show again.

To achieve that, the show button fires a command handled by the viewmodel, that gets data from database and populates a private member of type List<CompositeDataSource> called LoadedData (exposed as a property). After doing it, it calls OnPropertyChanged("LoadedData"). This method fires a PropertyChangedEventArgs("Loaded Data").

The XAML is the way I posted before.

When I debug the solution, the debugger shows me the property LoadedData being called (after the OnPropertyChanged) but the chart is never updated (no lines are shown).

I see that this doesn't work (using ItemsControl), so would you be so nice to explain me better how to use DependencyProperty in this case?

Thanks a lot in advance,

André

Nov 19, 2009 at 2:20 AM

Hi Andre

Refer this, this will give you some idea.

http://cid-996b1960e19fab56.skydrive.live.com/self.aspx/.Documents/LineGraph.zip

Regards

Ravi

Nov 19, 2009 at 10:31 AM

Hi Ravi,

That was awesome!

Now I get the idea, I wasn't thinking about extending the ChartPlotter class.

You saved me a lot of time, I really appreciated your help.

Best regards,

André

 

 

Jul 27, 2013 at 5:35 AM
Edited Jul 27, 2013 at 8:46 AM
Hi,

I am trying to use d3 chart plotter in MVVM. I am trying to use the code given by Ravi in my project, but not quite sure how to use it properly. It says "the property Linegraphs is not found in type ChartPlotter". What I did is add the LinegraphViewModel.cs to my project and make it the same namespace as my new project. Similarly ChartPlotter.cs was added as well.

Anyone can advice me on what else need to be done in order to use the plotter successfully in my MVVM application?

Thank you so much!
Oct 22, 2013 at 2:41 PM
akhomenko wrote:
Hi guys, I have a question regarding DataSource DP of a LineGraph object. I am working on a WPF project where I am using D3 line graph to display live data comming from a WCF service. I am receiving new data (an array of 1024 Uints) every second or so. I have implemeted DataSource as a CompositeDataSource of 2 EnumerableDataSources (xDataSource and yDataSource). When I receive a new array I simply copy it to yDataSource and fire RaiseDataChanged() event  on yDataSource which updates my graph. It works quite nicely. However, I was looking for a way to databind line graph in XAML to a datasource property of the ViewModel, and let WPF binding framework notify the graph when datasource changes? Do you have an example of something similar to this?   Thanks, Andrey
Hi Andrey,

Is it possible for you to share the code you did? i think i need such an example. Still could not get how to do this one what you have explained which works..

Regards
Ebru
Dec 10, 2013 at 7:30 AM
Hi Ravi,

Your solution here: http://cid-996b1960e19fab56.skydrive.live.com/self.aspx/.Documents/LineGraph.zip is really great.
I successfully applied it to my project. In my project, I have MyViewModel which contains CompositeDataSource with the size of 6,000.
Then it confuses me that it takes quite some time(about 10 seconds) before the visual is drawn(the extended ChartPlotter).
However the original built-in ChartPlotter would not take a single second to show.

I'd appreciate it if you could help me with this issue.

Best regards!
Peter