Pre loader

Axis labels shaking

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

Answered
0
0

I getting a weird behavior on my xAxis and yAxis with a real time SciChart.

The labels on axes and the chart itself start shaking like it is trying to update positions but it never gets steady.

I have a background routine adding data to the data series every second and every chart have two series with 2 YAxis, there are only two charts visible in the window at a given time.

Also I have noticed that after a few minutes of doing this the window itself get sluggish and not responsive anymore, I switch to another tab which doesn’t have a chart it start responding again.

Have anyone seeing something like this?

I have tried the Performance Tips and Tricks but nothing changes this behavior.

I’m using a Surface 3 pro with SciChart version 3.3.0.5909

Here is my XAML and the dispatcher timer adding data to the dataseries.

<UserControl 
x:Class="PulseControl.CustomControls.RealTimeEnergy" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:m="clr-namespace:PulseControl.Models"
xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" 
xmlns:ee="http://schemas.microsoft.com/expression/2010/effects" 
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" 
xmlns:Custom="http://metro.mahapps.com/winfx/xaml/shared" 
xmlns:PulseControl="clr-namespace:PulseControl" 
xmlns:converters="clr-namespace:PulseControl.Converters" 
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:s="http://schemas.abtsoftware.co.uk/scichart" 
xmlns:cc="clr-namespace:PulseControl.CustomControls"
Width="Auto"
Background="{StaticResource WindowBackgroundBrush}" 
mc:Ignorable="d" d:DesignHeight="140" d:DesignWidth="600" d:DataContext="{d:DesignInstance {x:Type m:MainWindowsModel}}"
>
<UserControl.Resources>
    <ResourceDictionary>
        <converters:IntToKiloConverter x:Key="Int2Kilo" />
    </ResourceDictionary>
</UserControl.Resources>

<DockPanel 
    Background="{StaticResource WindowBackgroundBrush}" >

    <Grid 
        DockPanel.Dock="Top"
        Height="140">
        <Grid.RowDefinitions>
            <RowDefinition Height="100"></RowDefinition>
            <RowDefinition Height="40"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="170"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="170"></ColumnDefinition>
        </Grid.ColumnDefinitions>


        <Border 
            Grid.Column="0"
            Grid.Row="0"
            CornerRadius="50"
            Width="170"
            Margin="0"
            Padding="0"
            Background="{StaticResource ColorLeftChartBrush}"
            BorderThickness="1">
            <TextBlock 
                Style="{StaticResource FieldTextBoxStyle}"
                Foreground="{StaticResource BlackBrush}"
                HorizontalAlignment="Center"
                Padding="0"
                Margin="0"
                FontSize="60"
                VerticalAlignment="Center"
                Text="{Binding Laser.OpData.AvgKiloVoltagePerSecond, Mode=OneWay, StringFormat={}{0:N1}}">
            </TextBlock>
        </Border>

        <Label
            Grid.Column="0"
            Grid.Row="1"
            Style="{StaticResource FieldLabelStyle}"
            FontSize="20"
            HorizontalAlignment="Center"
            VerticalAlignment="Top">
            Voltage (kV)
        </Label>


        <s:SciChartSurface 
            Name="sciChart" 
            Grid.Column="1"
            Grid.RowSpan="2"
            Height="140"
            Background="{StaticResource WindowBackgroundBrush}"
            s:SciChartGroup.VerticalChartGroup="OPERATION"
            Width="Auto"
            Margin="0"
            Padding="8 8 8 10"
            RenderPriority="Low"
            MaxFrameRate="30">

            <s:SciChartSurface.RenderableSeries>

                <s:FastMountainRenderableSeries 
                    x:Name="serieVoltage" 
                    SeriesColor="{StaticResource ColorLeftChart}" 
                    StrokeThickness="2"
                    YAxisId="LAXIS"
                    DataSeries="{Binding ChartData.ChartDataVoltage}">
                    <s:FastMountainRenderableSeries.AreaBrush>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                            <GradientStop Color="#A860a917" Offset="0"/>
                            <GradientStop Color="#3360a917" Offset="1"/>
                        </LinearGradientBrush>
                    </s:FastMountainRenderableSeries.AreaBrush>
                </s:FastMountainRenderableSeries>

                <s:FastMountainRenderableSeries 
                    x:Name="serieEnergy" 
                    SeriesColor="{StaticResource ColorRightChart}" 
                    StrokeThickness="2"
                    YAxisId="RAXIS"
                    DataSeries="{Binding ChartData.ChartDataEnergy}">
                    <s:FastMountainRenderableSeries.AreaBrush>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                            <GradientStop Color="#A83376E5" Offset="0"/>
                            <GradientStop Color="#333376E5" Offset="1"/>
                        </LinearGradientBrush>
                    </s:FastMountainRenderableSeries.AreaBrush>
                </s:FastMountainRenderableSeries>

            </s:SciChartSurface.RenderableSeries>

            <s:SciChartSurface.XAxis >
                <s:DateTimeAxis Name="xAxis" AutoRange="Always"  IsStaticAxis="True" TextFormatting="dd HH:mm" SubDayTextFormatting="HH:mm:ss" CursorTextFormatting = "mm:ss" Foreground="White"  />
            </s:SciChartSurface.XAxis>

            <s:SciChartSurface.YAxes>
                <s:NumericAxis 
                    AutoRange="Always" 
                    GrowBy="0,0.5"
                    IsPrimaryAxis="True"
                    AxisAlignment="Right"
                    Id="RAXIS"
                    Style="{StaticResource NoMinorLines}">
                </s:NumericAxis>
                <s:NumericAxis 
                    AutoRange="Always" 
                    GrowBy="0,0.25"
                    IsPrimaryAxis="False"
                    Id="LAXIS"
                    AxisAlignment="Left"
                    Style="{StaticResource NoMinorLines}">
                </s:NumericAxis>
            </s:SciChartSurface.YAxes>

            <s:SciChartSurface.ChartModifier>
                <s:ModifierGroup>
                    <s:RubberBandXyZoomModifier IsEnabled="{Binding ChartData.ZoomEnabled, Mode=TwoWay}" IsXAxisOnly="True"></s:RubberBandXyZoomModifier>
                    <s:ZoomPanModifier IsEnabled="{Binding ChartData.PanEnabled, Mode=TwoWay}"></s:ZoomPanModifier>
                    <s:MouseWheelZoomModifier IsEnabled="{Binding ChartData.MouseWheelEnabled, Mode=TwoWay}"></s:MouseWheelZoomModifier>
                    <s:RolloverModifier IsEnabled="{Binding ChartData.RolloverEnabled, Mode=TwoWay}"></s:RolloverModifier>
                    <s:CursorModifier IsEnabled="{Binding ChartData.CursorEnabled, Mode=TwoWay}"></s:CursorModifier>
                    <s:YAxisDragModifier></s:YAxisDragModifier>
                    <s:XAxisDragModifier></s:XAxisDragModifier>
                    <s:ZoomExtentsModifier></s:ZoomExtentsModifier>
                </s:ModifierGroup>
            </s:SciChartSurface.ChartModifier>

        </s:SciChartSurface>

        <Border 
            Grid.Column="2"
            Grid.Row="0"
            CornerRadius="50"
            Width="170"
            Margin="0"
            Padding="0"
            Background="{StaticResource ColorRightChartBrush}"
            BorderThickness="1">
            <TextBlock 
                Style="{StaticResource FieldTextBoxStyle}"
                Foreground="{StaticResource BlackBrush}"
                HorizontalAlignment="Center"
                Padding="0"
                Margin="0"
                FontSize="60"
                VerticalAlignment="Center"
                Text="{Binding Laser.OpData.AvgEnergyPerSecond, Mode=OneWay, StringFormat={}{0:N1}}">
            </TextBlock>
        </Border>

        <Label
            Grid.Column="2"
            Grid.Row="1"
            Style="{StaticResource FieldLabelStyle}"
            FontSize="20"
            HorizontalAlignment="Center"
            VerticalAlignment="Top">
            Energy (mJ)
        </Label>

    </Grid>

</DockPanel>

Model

void _timer_Tick(object sender, EventArgs e)
    {
        DateTime now = DateTime.Now;

            // Things to do when running
        SafeAddPoint(_chartDataEnergy, now, Laser.OpData.AvgEnergyPerSecond);
        SafeAddPoint(_chartDataEfficiency, now, Laser.OpData.ChamberEfficiency * 100.0);
        SafeAddPoint(_chartDataVoltage, now, Laser.OpData.AvgKiloVoltagePerSecond);
        SafeAddPoint(_chartDataPressure, now, Laser.OpData.Pressure);
        SafeAddPoint(_chartDataSigmaEnergy, now, Laser.OpData.SampleSigma);
        SafeAddPoint(_chartDataSigmaPercentage, now, Laser.OpData.SampleSigmaPercentage);
        SafeAddPoint(_chartDataTemperature, now, Laser.OpData.Temperature);
    }

    private void SafeAddPoint(IDataSeries serie, DateTime dt, double val)
    {
        if (serie.ParentSurface != null)
            using (serie.ParentSurface.SuspendUpdates())
                ((XyDataSeries<DateTime, double>)serie).Append(dt, val);
        else
            ((XyDataSeries<DateTime, double>)serie).Append(dt, val);
    }
Images
  • You must to post comments
Best Answer
0
0

Hi Jesus,

This issue has been fixed in SciChart v3.6.1. I’m not sure the exact version / build but if you look in our release notes you’ll see this:

  • SC-2700 Fix a recursive layout bug where SciChartSurface resized continually in the Visual Studio designer
  • SC-2510 Fixed a bug where Axis oscillates in size (bug in layout)

I would recommend updating to the latest v3.x if you can.

Best regards,
Andrew

  • You must to post comments
0
0

I have uploaded a gif image to show the behavior, you need to open it as a gif

  • You must to post comments
0
0

Hi Andrew, thanks for your help.

Unfortunately my license is expired for newer versions, like the one with the fix.

It is there any way to test if the updated version fix my issue before renewing my subscription?

I have tried removing the license line in my code but is still giving me the expired license message.

Thanks

  • Andrew Burnett-Thompson
    Hi Jesus, I’ve just emailed you a trial key to try it out. Interested to know if the issue is resolved on your PC!
  • Jesus Mogollon
    Confirmed is fix on the newer version, thanks for your help.
  • You must to post comments
0
0

Thanks Andrew, I will test it using this license.

In the meanwhile I have found what is triggering this.

The Surface Pro is a tablet/laptop device and because of that (and resolution) the font is recommended to be 150%

With this font size the axis labels shakes like they can’t find the proper position,

If I decrease the font size to 125% it works normally.

I’m looking forward to see if the fix on the new version can handle the 150% font size better because we won’t have control over the font size in our final user machine and this is the default.

I will let you know how it goes.

  • You must to post comments
Showing 4 results
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies