c# - Live chart using WPF Toolkit Line Series -


i have chart control wpf toolkit. data collection bound line series used in chart dynamic, i.e., new points added collection when receive data. noticed because of this, memory consumption increasing. so, limited number of points displayed in line series 20. following code.

code behind:

public partial class mainwindow : window {     observablecollection<chartdata> lineseries1data;     thread mythread;     lineseries lineseries;     chartdata objchartdata;     random r = new random();     lineseries temp;      public mainwindow()     {         initializecomponent();         objchartdata = new chartdata();         lineseries1data = new observablecollection<chartdata>();         addlineseries();         initializedatapoints();         mythread = new thread(new threadstart(startchartdatasimulation));      }      private void addlineseries()     {         lineseries = addlineseries(brushes.tomato);         lineseries.dependentvaluepath = "value";         lineseries.independentvaluepath = "name";         lineseries.itemssource = lineseries1data;         simchart.series.add(lineseries);     }      private lineseries addlineseries(brush linecolor)     {         temp = new lineseries()         {             polylinestyle = this.findresource("polylinestyle") style,             datapointstyle = this.findresource("linedatapointstyle") style,             style = this.findresource("commonlineseries") style,             tag = linecolor         };         return temp;     }      private void initializedatapoints()     {         lineseries1data.add(new chartdata() { name = datetime.now, value = 0.0 });         thread.sleep(1000);         (int = 0; < 2; i++)         {             lineseries1data.add(new chartdata() { name = datetime.now, value = new random().nextdouble() * 10 });             thread.sleep(1000);         }      }      public void startchartdatasimulation()     {         int = 0;         while (true)         {             dispatcher.invoke(new action(() =>             {                 objchartdata.name = datetime.now;                 objchartdata.value = r.nextdouble() * 50;                 lineseries1data.add(objchartdata);                 if (lineseries1data.count > 20)                 {                     lineseries1data.removeat(0);                 }             }));             thread.sleep(500);         }     }       private void btnstartcharting_click(object sender, routedeventargs e)     {         if (mythread.threadstate != threadstate.running)         {             mythread.start();         }     }  }  public class chartdata {     datetime _name;     double _value;      public datetime name     {                 {             return _name;         }         set         {             _name = value;         }     }      public double value     {                 {             return _value;         }         set         {             _value = value;         }     }  } 

xaml:

<window x:class="wpfchartexample.mainwindow"     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"     xmlns:chrt="clr-namespace:system.windows.controls.datavisualization.charting;assembly=system.windows.controls.datavisualization.toolkit"     xmlns:datavis="clr-namespace:system.windows.controls.datavisualization;assembly=system.windows.controls.datavisualization.toolkit"     title="wpf toolkit dynamic line chart example" height="333" width="1000" closing="window_closing"> <window.resources>     <style x:key="polylinestyle" targettype="polyline">         <setter property="strokethickness" value="5" />     </style>      <style x:key="linedatapointstyle" targettype="chrt:linedatapoint">         <!--<setter property="background" value="#0077cc" />-->         <setter property="background" >             <setter.value>                 <binding path="tag" relativesource="{relativesource ancestortype={x:type chrt:lineseries}}" />             </setter.value>         </setter>         <setter property="borderbrush" value="white" />         <setter property="borderthickness" value="2" />         <setter property="istabstop" value="false" />         <setter property="height" value="10" />         <setter property="width" value="10" />         <setter property="template">             <setter.value>                 <controltemplate targettype="chrt:linedatapoint">                     <grid x:name="root" opacity="1">                         <tooltipservice.tooltip>                             <stackpanel margin="2,2,2,2">                                 <contentcontrol content="{templatebinding independentvalue}" contentstringformat="x-value: {0:hh:mm:ss}"/>                                 <contentcontrol content="{templatebinding dependentvalue}" contentstringformat="y-value: {0:###.###}"/>                             </stackpanel>                         </tooltipservice.tooltip>                         <ellipse strokethickness="{templatebinding borderthickness}" stroke="{templatebinding borderbrush}" fill="{templatebinding background}"/>                     </grid>                 </controltemplate>             </setter.value>         </setter>     </style>      <style x:key="commonlineseries" targettype="chrt:lineseries" basedon="{staticresource {x:type chrt:lineseries}}">         <setter property="template">             <setter.value>                 <controltemplate targettype="chrt:lineseries">                     <canvas x:name="plotarea">                         <polyline points="{templatebinding points}" stroke="{binding tag, relativesource={relativesource ancestortype={x:type chrt:lineseries}}}" style="{templatebinding polylinestyle}"/>                     </canvas>                 </controltemplate>             </setter.value>         </setter>     </style>       <style x:key="linearaxisstyle" targettype="chrt:linearaxis">         <setter property="gridlinestyle">             <setter.value>                 <style targettype="line">                     <setter property="stroke" value="#20000000" />                 </style>             </setter.value>         </setter>     </style>      <style x:key="nonlinearaxisstyle" targettype="chrt:datetimeaxis">         <setter property="gridlinestyle">             <setter.value>                 <style targettype="line">                     <setter property="stroke" value="#20000000" />                 </style>             </setter.value>         </setter>     </style>      <style x:key="datetimeaxislabelstyle" targettype="chrt:datetimeaxislabel">         <setter property="stringformat" value="{}{0:mm:ss}" />     </style>      <style x:key="charttitlestyle" targettype="datavis:title">         <setter property="visibility" value="collapsed"/>     </style> </window.resources> <grid name="grdmain">     <grid.rowdefinitions>         <rowdefinition height="6*" />         <rowdefinition height="auto" />     </grid.rowdefinitions>     <chrt:chart x:name="simchart"  titlestyle="{staticresource resourcekey=charttitlestyle}">         <chrt:chart.legendstyle>             <style targettype="datavis:legend">                 <setter property="width" value="0" />             </style>         </chrt:chart.legendstyle>         <chrt:chart.axes>             <chrt:datetimeaxis name="xaxis" showgridlines="true" orientation="x" style="{staticresource resourcekey=nonlinearaxisstyle}" axislabelstyle="{staticresource resourcekey=datetimeaxislabelstyle}" />             <chrt:linearaxis orientation="y" showgridlines="true" style="{staticresource resourcekey=linearaxisstyle}" />         </chrt:chart.axes>          <!--<chrt:lineseries isselectionenabled="true" polylinestyle="{staticresource resourcekey=polylinestyle}"                           datapointstyle="{staticresource resourcekey=linedatapointstyle}"                           itemssource="{binding}"                          independentvaluebinding="{binding name}"                           dependentvaluebinding="{binding value}"                          tag="red" style="{staticresource commonlineseries}">          </chrt:lineseries>-->     </chrt:chart>     <button name="btnstartcharting"              grid.row="1"              width="auto"              horizontalalignment="right"              margin="5"             click="btnstartcharting_click">         start charting     </button> </grid> 

in above code, when remove first point, graph refresh affected. refresh become slow , stops refreshing. older datapoints visible on graph. can guide me on making dynamic charts wpf toolkit?


Comments

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

javascript - Highcharts multi-color line -

javascript - Enter key does not work in search box -