This is a migrated thread and some comments may be shown as answers.

Performance problems

3 Answers 140 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Auvo
Top achievements
Rank 1
Auvo asked on 23 Jan 2012, 12:55 PM
Hi,

How I can improve the radChart performance when I do a (Window) resizing or zooming ?

I need to show several lineseries with several thousand of points. I'm okay of loading the data to series (it takes around 2-3sec) but after that if I wan't to do windows resizing or zooming, it's lock the UI and takes more than 10sec (if I have 5 series or more loaded to screen) to refresh the screen !!??

I really need to show the actual data so I cannot use the SamplingThreshold - feature

Can I disable redraw or something during the zooming/resizing?

Here's the full code of my demo project.
public partial class MainWindow : Window
{
    private DataTable dt = null;
    public MainWindow()
    {
        InitializeComponent();
        radChart1.DefaultView.ChartArea.EnableAnimations = false;
        radChart1.DefaultView.ChartLegend.Visibility = System.Windows.Visibility.Collapsed;
        //radChart1.SamplingSettings.SamplingFunction = ChartSamplingFunction.Average;
        radChart1.SamplingSettings.SamplingThreshold = 0;
        radChart1.DefaultView.ChartArea.AxisX.DefaultLabelFormat = "HH:mm:ss";
        radChart1.DefaultView.ChartArea.ZoomScrollSettingsX.ScrollMode = ScrollMode.ScrollAndZoom;
        radChart1.DefaultView.ChartArea.AxisX.AutoRange = false;
        radChart1.DefaultView.ChartArea.AxisX.IsDateTime = true;
        radChart1.DefaultView.ChartArea.AxisX.MinValue = DateTime.Now.ToOADate();
        radChart1.DefaultView.ChartArea.AxisX.MaxValue = DateTime.Now.AddMinutes(5000).ToOADate();
    }
    private void button2_Click(object sender, RoutedEventArgs e)
    {
        dt = CreateDataTable("SERIES_" + radChart1.SeriesMappings.Count.ToString());
        MessageBox.Show("Data generated for series: " + "SERIES_" + radChart1.SeriesMappings.Count.ToString());
        AddNewSeries("SERIES_" + radChart1.SeriesMappings.Count.ToString());
    }
    private void AddNewSeries(String tag)
    {
        AxisY axisY = new AxisY();
        axisY.AxisName = tag;
        axisY.Title = tag;
        axisY.DefaultLabelFormat = "#VAL{#,##0.00}";
        axisY.AutoRange = false;
        axisY.MinValue = 0;
        axisY.MaxValue = 200;
        axisY.Step = 10;
        Style customAxisYStyle = this.Resources["CustomAxis"] as Style;
        axisY.AxisStyles.AxisLineStyle = customAxisYStyle;
        axisY.AxisStyles.TickLineStyle = this.Resources["AxisYTickStyle"] as Style;
        axisY.AxisStyles.MinorTickLineStyle = this.Resources["AxisYMinorTickStyle"] as Style;
        axisY.AxisStyles.ItemLabelStyle = this.Resources["ItemLabelStyle"] as Style;
        axisY.AxisStyles.TitleStyle = this.Resources["AxisTitleStyle"] as Style;
        if (radChart1.DefaultView.ChartArea.AxisY.AxisName == "")
        {
            radChart1.DefaultView.ChartArea.AxisY = axisY;
        }
        else
        {
            radChart1.DefaultView.ChartArea.AdditionalYAxes.Add(axisY);
            axisY.Visibility = System.Windows.Visibility.Collapsed;
        }
        LineSeriesDefinition seriesDef = new LineSeriesDefinition();
        seriesDef.ShowItemLabels = false;
        seriesDef.ShowPointMarks = false;
        seriesDef.ShowItemToolTips = false;
        seriesDef.SeriesName = tag;
        SeriesMapping m1 = new SeriesMapping();
        m1.ItemMappings.Add(new ItemMapping() { DataPointMember = DataPointMember.YValue, FieldName = tag, FieldType = typeof(double) });
        m1.ItemMappings.Add(new ItemMapping() { DataPointMember = DataPointMember.XValue, FieldName = tag + "_TS", FieldType = typeof(DateTime) });
        m1.SeriesDefinition = seriesDef;
        m1.LegendLabel = tag;
        m1.SeriesDefinition.AxisName = axisY.AxisName;
        m1.ItemsSource = dt;
        radChart1.SeriesMappings.Add(m1);
    }
    DataTable CreateDataTable(String tagName)
    {
        DataTable dt = new DataTable();
        dt.Columns.Add(new DataColumn(tagName, typeof(Double)));
        dt.Columns.Add(new DataColumn(tagName + "_TS", typeof(DateTime)));
        Random r = new Random(Environment.TickCount);
        for (int i = 0; i < 5000; i++)
        {
            DataRow dr = dt.NewRow();
            if (radChart1.DefaultView.ChartArea.HasItems)
                dr[tagName] = r.Next(1, 100);
            else
                dr[tagName] = r.Next(1, 100);
            dr[tagName + "_TS"] = DateTime.Now.AddMinutes(i);
            dt.Rows.Add(dr);
        }
        return dt;
    }
}


3 Answers, 1 is accepted

Sort by
0
Yavor
Telerik team
answered on 26 Jan 2012, 10:59 AM
Hello Auvo,

We have identified the limitations of RadChart for Silverlight/WPF and we came up with a new charting solution - the RadChartView. It is designed with performance in mind and I am sure you will be pleased with the results. Here are some of the most important highlights: 

  • Performance: exceptional performance, intuitive and easy-to-use model and pixel-perfectness were some of the major tasks we have set for this new control.
    • We have separated the chart into several layers, where the core one is totally platform agnostic and is built on top of our custom logical tree. We call this layer the “View Model” of the chart.
    • We have a custom property store used within the charting logical tree. It is about 5 timesfaster than DependencyObject in look-up time and consumes about 3 times less memory.
    • We have an entirely custom layout and do not rely on the SL layout system to arrange our charting view models.
    • We have a stand-alone visualization layer that presents the chart view model. Every view model is presented by the simplest possible SL visual – e.g. Rectangle, Line, Polyline, etc. Still, every single aspect is fully customizable by specifying Data Templates or Styles.
    • We use Canvas – the only SL panel that does not invalidate measure automatically. When a redraw of some charting part is required, we simply update the Width, Height and Canvas.Left, Canvas.Top properties of the corresponding visual. A simple test proved that calling InvalidateMeasure of the canvas upon a change the in view model degrades performance about 10 times.
  • Architecture: a number of chart controls built for a specific purpose vs one monolith control (provides cleaner, simpler, and relevant API)
    • RadCartesianChart -- hosts Bar, Area, Line, Spline, SplineArea, ScatterPoint, Candlestick, and OHLC series types (and their horizontal & stacked / stacked100 equivalents where applicable).
    • RadPieChart -- hosts Pie series type.
    • RadPolarChart -- hosts PolarLine, PolarArea, PolarPoint, RadarLine, RadarArea, RadarPoint series types.
  • Notable features
    • Financial indicators -- support for about 20 most common financial indicators to complement the data visualization for all cartesian series types.
    • Extended DateTime support built-in in the axes' logic
      • DateTimeCategoricalAxis -- Specialized categorical axis that expects each data point to provide a System.DateTime structure as its value for this axis. The points are grouped by a user-defined date-time component (Year, Month, Day, etc.) and then the groups are sorted chronologically.
      • DateTimeContinuousAxis -- Specialized axis that expects each data point to provide a System.DateTime structure as its value for this axis. May be thought of as a timeline where the coordinate of each data point is calculated depending on the position of its associated DateTime on the timeline. The base unit (or the timeline step) of the axis is calculated depending on the smallest difference between any two dates.
    • Support for linear and logarithmic axes.
    • Built-in data sampling.
    • Behaviors:
      • PanAndZoom Behavior -- with smooth scrolling support.
      • TrackBall Behavior.
      • ToolTip Behavior.

Hope this helps!

Regards,
Yavor
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Auvo
Top achievements
Rank 1
answered on 17 Feb 2012, 12:54 PM
Hi,

RadChartView looks promising.

Only thing is that I need multiple Y - axis feature and what I read the current features of RadChartView, its not support multiple Y-axis but will be release later on.

When the multiple y-axis feature is available in RadChartView control? Any demo version available what I could use?

Regards,
Auvo
0
Giuseppe
Telerik team
answered on 17 Feb 2012, 01:48 PM
Hello Auvo,

Support for multiple axes (horizontal and vertical) has been added for the Q1 2012 release that became public earlier this week.

You can find the release notes here and online example here (the example is equivalent and available in the WPF ClickOnce demo application as well).


All the best,
Giuseppe
the Telerik team
Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
Tags
Chart
Asked by
Auvo
Top achievements
Rank 1
Answers by
Yavor
Telerik team
Auvo
Top achievements
Rank 1
Giuseppe
Telerik team
Share this question
or