More animation problems

[SteveL]

I'm using the latest internal build now, which has fixed the problems I was having previously. But I still have a problem with the gauge animation. My application reads data every few seconds, shows it on a gauge and plots it on a line chart. After a few minutes, the gauge animation gets 'jerky', and the CPU usage of the browser starts increasing. This gets worse the longer the application runs. I don't know whether the problem is with the gauge, the chart, or something I am doing wrong. I have produced a simple test case which uses random data to demonstrate the problem. The jerky animation starts after about 10 minutes and continues to get worse.

 <Grid x:Name="LayoutRoot">
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
        <control:RadGauge x:Name="GustGauge" Width="150" Grid.Row="0" Height="150" >
            <gauge:RadialGauge >
                <gauge:RadialScale x:Name="radialScale" Min="0" Max="100" >
                    <gauge:IndicatorList>
                        <gauge:Needle x:Name="needle" IsAnimated="true" Duration="0:0:2" Value="0" />
                    </gauge:IndicatorList>
                </gauge:RadialScale>
            </gauge:RadialGauge>
        </control:RadGauge>
        <telerikchart:RadChart x:Name="testChart" Grid.Row="1" Height="250" Width="700"/>
    </Grid>

public partial class MainPage : UserControl
    {
        private ObservableCollection<TestData> testDataSource;
        private Random random;
        DispatcherTimer timer;

        public MainPage()
        {
            InitializeComponent();

            random = new Random();

            testDataSource = new ObservableCollection<TestData>();

            testChart.DefaultView.ChartArea.AxisX.IsDateTime = true;
            testChart.DefaultView.ChartArea.AxisX.DefaultLabelFormat = "t";

            // turn off animations
            testChart.DefaultView.ChartArea.EnableAnimations = false;

            // create mapping of data to axes
            SeriesMapping seriesMapping = new SeriesMapping();
            seriesMapping.SeriesDefinition = new LineSeriesDefinition();
            seriesMapping.SeriesDefinition.ShowItemLabels = false;
            seriesMapping.SeriesDefinition.ShowItemToolTips = true;
            (seriesMapping.SeriesDefinition as LineSeriesDefinition).ShowPointMarks = false;
            seriesMapping.SeriesDefinition.ItemToolTipFormat = "F1";
            seriesMapping.LegendLabel = "Test data";

            ItemMapping itemMapping = new ItemMapping();
            itemMapping.DataPointMember = DataPointMember.XValue;
            itemMapping.FieldName = "DT";
            seriesMapping.ItemMappings.Add(itemMapping);

            ItemMapping itemMapping2 = new ItemMapping();
            itemMapping2.DataPointMember = DataPointMember.YValue;
            itemMapping2.FieldName = "TestItem";
            seriesMapping.ItemMappings.Add(itemMapping2);

            testChart.SeriesMappings.Add(seriesMapping);
            testChart.ItemsSource = testDataSource;

            timer = new DispatcherTimer();
            timer.Interval = TimeSpan.FromMilliseconds(2500);

            timer.Tick += new EventHandler(timer_Tick);
            timer.Start();
        }

        private void timer_Tick(object sender, EventArgs e)
        {
            double nextitem = random.Next(100);
            TestData td = new TestData {DT = DateTime.Now, TestItem = nextitem};
            needle.Value = nextitem;
            testDataSource.Add(td);

        }
    }

    public class TestData
    {

        public DateTime DT { get; set; }

        public double TestItem
        {
            get { return _testitem; }
            set
            {
                _testitem = value;
                var handler = PropertyChanged;
                if (null != handler)
                {
                    handler.Invoke(this, new PropertyChangedEventArgs("TestItem"));
                }
            }
        }

        private double _testitem;

        public event PropertyChangedEventHandler PropertyChanged;
    }

 

[Vladimir Milev]

Hi Steve,

We will need some time to investigate the issue. Thanks for reporting it.

All the best,
Vladimir Milev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Vladimir Milev]

Hi Steve,

We have made some improvements of our memory usage in the latest internal build. You can check it to see if that helps.

Greetings,
Vladimir Milev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[SteveL]

That hasn't made any difference. After a few minutes of adding points to the graph, the gauge needle gets 'jerky'. It moves quickly to part way between the old value and the new value, then smoothly animates the rest of the way.

Steve

[SteveL]

I have devised a work around. I am doing the needle animation myself using a storyboard, and in the storyboard's Completed event handler, I'm adding the new points to the chart, so the chart doesn't interfere with the animation. So far, this seems to be working OK.

Steve