Tag: Annotations

Hi,

I am working on a live graph similar to the sparse impulse series 3D and would like to add live annotations to the plotted data points to display the Y axis value.

Does the SciChart3DSurface support annotations?

If not I would like to instead use the TooltipModifier3D, but would like to force the tooltip to be displayed all the time and reduce the amount of data displayed to a single Y-Axis value. Does this sound reasonable.

Thanks

Marc

Hello
I’m working on a WPF app. Everything is OK except that I don’t understand how to render the series above the annotations.
The XAML code is the following:

<s:SciChartSurface Name="sciChartSurface"
                   s:ThemeManager.Theme="SciChartv4Dark"
                   Annotations="{Binding Path=Annotations}"
                   ChartTitle="{Binding Path=GraphTitle}"
                   DataContext="{Binding Path=ChartViewModel,
                   RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type charts:ChartView}}}"
                   FocusVisualStyle="{x:Null}"
                   Focusable="True"
                   SeriesSource="{Binding Path=Series}"
                   Padding="0 5 8 0">

    <s:SciChartSurface.RenderSurface>
        <s:HighQualityRenderSurface/>
    </s:SciChartSurface.RenderSurface>
    <s:SciChartSurface.ChartModifier>
        <s:ModifierGroup>


         [...]



        </s:ModifierGroup>
    </s:SciChartSurface.ChartModifier>

    <!--  Create an X Axis  -->
    <s:SciChartSurface.XAxis>
        <s:NumericAxis AutoRange="{Binding Path=XAxis.AutoScaling,
                                           Converter={StaticResource BooleanToAutoRangeConverter}}"
                       AxisTitle="{Binding Path=XAxis.AxisTitle}"
                       DrawMajorGridLines="{Binding Path=XAxis.ShowGridLines}"
                       DrawMinorGridLines="False"
                       DrawMinorTicks="True"
                       GrowBy="0, 0.1"
                       AxisBandsFill="#1c1c1e" 
                       VisibleRange="{Binding Path=XAxis.AxisRange,
                                              Mode=TwoWay}"
                       MajorDelta="{Binding XAxis.MajorDelta, Mode=TwoWay}"
                       MinorDelta="{Binding XAxis.MinorDelta, Mode=TwoWay}"
                       AutoTicks="{Binding XAxis.AutoTicks}" 
                       />
    </s:SciChartSurface.XAxis>

    <!--  Create a Y Axis  -->
    <s:SciChartSurface.YAxis>
        <s:NumericAxis AutoRange="{Binding Path=YAxis.AutoScaling,
                                           Converter={StaticResource BooleanToAutoRangeConverter}}"
                       AxisAlignment="Left"
                       AxisTitle="{Binding Path=YAxis.AxisTitle}"
                       DrawMajorGridLines="{Binding Path=YAxis.ShowGridLines}"
                       DrawMinorGridLines="False"
                       DrawMinorTicks="True"
                       GrowBy="0.1, 0.1"
                       IsPrimaryAxis="True"
                       AxisBandsFill="#1c1c1e" 
                       VisibleRange="{Binding Path=YAxis.AxisRange,
                                              Mode=TwoWay}"
                       MajorDelta="{Binding YAxis.MajorDelta, Mode=TwoWay}"
                       MinorDelta="{Binding YAxis.MinorDelta, Mode=TwoWay}"
                       AutoTicks="{Binding YAxis.AutoTicks}"
                       />
    </s:SciChartSurface.YAxis>
</s:SciChartSurface>

Edit: this is the code that creates the horizontal annotation:

 /// <summary>
    /// Creates a chart annotation
    /// </summary>
    /// <param name="a"></param>
    /// <returns></returns>
    private AnnotationBase CreateChartAnnotation(Annotation a)
    {
        HorizontalLineAnnotation annotation;

        //not used??
        //ColorToBrushConverter brushConverter = new ColorToBrushConverter();

        annotation = new HorizontalLineAnnotation() { Y1 = a.ThresholdValue.Value };
        annotation.Stroke = new SolidColorBrush((Color)ColorConverter.ConvertFromString(a.Stroke));
        annotation.HorizontalAlignment = System.Windows.HorizontalAlignment.Stretch;
        annotation.IsEditable = false;
        annotation.LabelTextFormatting = string.Format("{0} 0.0", a.Label);
        annotation.StrokeThickness = 2;
        annotation.LabelPlacement = LabelPlacement.Axis;
        annotation.ShowLabel = a.ShowLabel;
        if (a.DashArray != null)
        {
            annotation.StrokeDashArray = new DoubleCollection(a.DashArray);
        }


        return annotation;
    }

I tried to set AnnotationCanvas.BelowChart but the behaviour is very strange: the horizontal annotation line is no more continuous
I attached two jpegs

Regards
Gianpaolo

Using MVVM, I have an AnnotationCollection databound to the SciChartSurface.Annotations. Individual LineAnnotations are added to the collection as the application code runs.

If annotations are added while the chart is displayed, they are all drawn correctly.

However, if the chart page is reloaded (say, the user navigates to a different page and then returns to the chart page), the annotations do not always redraw. If the annotations have AnnotationCanvas set to default (AnnotationCanvas.AboveChart, I believe) they redraw correctly about 50% of the time. If the annotations’ AnnotationCanvas is set to AnnotationCanvas.XAxis, they never redraw.

All the annotations still exist in the ObservableCollection in all these cases, so they shouldn’t need to be re-created.

Is this a bug in SciChart or is there something I may be doing wrong with the annotations?
(There is only one X-Axis so no axisID is necessary.)

LineAnnotation lAnno = new LineAnnotation();
lAnno.CoordinateMode = AnnotationCoordinateMode.RelativeY;
lAnno.Y1 = 0.0;
lAnno.X1 = DataPoints;
lAnno.Y2 = 1.0;
lAnno.X2 = DataPoints;
lAnno.YAxisId = "Counts";
lAnno.Foreground = new System.Windows.Media.SolidColorBrush(System.Windows.Media.Color.FromRgb(255, 255, 255));
lAnno.Stroke = new System.Windows.Media.SolidColorBrush(System.Windows.Media.Color.FromArgb(96, 255, 0, 0));
lAnno.StrokeThickness = 2;
lAnno.AnnotationCanvas = AnnotationCanvas.XAxis;

Markers.Add(lAnno);

Hi all, how i can add annotation on the columns of a chart?

Is there a way to draw an svg formatted annotation onto a chart for WPF?

I have found references/examples for it in javascript here . . .

https://www.scichart.com/documentation/js/current/Tutorial%2006%20-%20Adding%20Annotations.html

but not for any other platform.

I have an unfinished project using the trial version on Visblox. I did not buy the licence since the performance was not good enough. Now Visiblox stopped support and so I am migrating to SciCharts. I have some questions though hope you can help.

1. The chart is DateTime,Double type, and there are multiply datapoints on some dates. When editing I need to delete particular points but the Remove method seems to remove all Y values for specific X value. So is it possible to remove a particular X,Y datapoint only from the chart?

2. I need to give each datapoint a name and I was using TextAnnotations on Visiblox (which had a datapoint property). However on SCIcharts the TextAnnotations does not have Datapoint property. How can I do this please?

3. I have 2 charts showing audio waveforms. One showing the full time and one showing a zoomed section. When I hit Play I need the zoomed chart to follow the music waveform. With Visiblox I was using a dispatcher timer and on every tick(20ms) I update the Xaxis range, however the performance was not very good.
   What best method to use for SCI charts please?

Hi,

CompositeAnnotation works perfectly and easy to use, but I need it in MVVM. CompositeAnnotationViewModel looks the same, but it is not visible. This is my code:

AnnotationViewModels.Add(new CompositeAnnotationViewModel()
{
    Annotations = new ObservableCollection<IAnnotationViewModel>()
    {
        new VerticalLineAnnotationViewModel
        {
            VerticalAlignment = VerticalAlignment.Stretch,
            Stroke = Colors.Blue,
            StrokeThickness = 2,
            IsEditable = true,
            StrokeDashArray = new DoubleCollection() { 2, 2 },
            CoordinateMode = AnnotationCoordinateMode.Relative,
            X1 = 0
        },
        new VerticalLineAnnotationViewModel
        {
            VerticalAlignment = VerticalAlignment.Stretch,
            Stroke = Colors.Blue,
            StrokeThickness = 2,
            IsEditable = true,
            StrokeDashArray = new DoubleCollection() { 2, 2 },
            CoordinateMode = AnnotationCoordinateMode.Relative,
            X1 = 1
        }
    },
    IsEditable = true,
    X1 = 3,
    X2 = 5
});

What is my mistake?

I am working on an MVVM application that has a dozen or so view models, each having multiple XY data series that are being displayed in a chart. Now I need to add annotations to the charts for some of the view models. I have some code up and running but am running into a few issues and I wanted to see if you have any suggestions for a way forward.

The first issue relates to performance. Each data series (~100K data points) can have several thousand annotations associated with it. In the app, the view models are all created in memory and the user can change between them by selecting one in a list box (see attached image). Once the number of annotations starts to get into the thousands, I start to notice a delay when switching between data models where one of them contains annotations. If I click a different item in the list box, it takes a few seconds before the selection actually changes and the chart is updated. The delay seems to be more pronounced when switching FROM a view model that has annotations TO one that does not contain them. The delay increases with the number of annotations. I’m not sure if there is anything that can be done about this but thought I would check.

The second issue relates to how the view models are created. Because I am loading data for ALL of the view models into memory, I am trying to create them asynchronously in a background thread as much as possible so the UI remains responsive. That was fine when I was just dealing with the XY data, but it is causing problems for the annotations. If I try to create the CustomAnnotation objects in a background thread I get an error “The calling thread must be STA, because many UI components require this.” Do you have any suggestions for how to create lots of annotations while keeping the UI responsive?

Thanks,
Scott

Hello Everyone,

I have set up a few annotations in my project and set their visibility to hidden.
I am displaying only the selected one from a combobox I have set up for the user.
But each time the chart does ZoomExtents. all the annotations appear and their visibility resets to visible.
Is this intentional?
Can I disable this option?

Thank you in advance.

I want to add annotations programmatically. I need to add line with arrow and textbox at Y1 and X1 of a line. It creates pointed annotation.

Hi,

I’m looking for an annotation that have text and a line or rectangle (like in commix speech balloon) that are anchored to a point on the chart.
Is there such a build in annotation or do I have to build it myself?

Hello SciChart-Team,
we had the requirement to show the zero line when there are negative values ​​in the chart.
We noticed the following things, especially in connection with the main grid lines.
There are some side effects at certain sizes of the window:
When the gridlines are on(see screenshot 1):
1. Grid line and tick are not on the same level (Only for certain sizes)
2. The grid line and horizontal annotation line (green) are not aligned either (Only at certain sizes)
3. The axis line (defined via BorderThickness) is also not aligned with the grid line (regardless of the size of the control).And the bottom tick is never aligned with the major grid line

If the major grid lines are switched off, the zero annotation line is not aligned to the ticks for certain sizes of the control (see screenshot 2)

It looks like different algorithms were used to calculate the line position of the ticks, grid lines and line annotations.

The problem was detected on the monitor with 100% scaling. On a 4K monitor with scaling > 100%, the problem became even more apparent

Do you have any suggestion how to solve the problem?

I’ve attached a modified example project in which the behavior can be reproduced.

Regards
Silvester Schneidt

I am working on an application where I have multiple XY data series. For one of the series, we are producing annotation data for some of the points. There are 8 different types of annotations that can be created. Based on the response you gave to a previous question, I am creating the annotations as separate data series instead of as actual annotation objects since there are thousands of them. Performance starts to suffer as the number of annotations increases.

The issue I’m running into now is the number of series is now 14 which is unwieldy for displaying in a legend. My current legend is horizontally oriented as shown in the attached image. I would prefer that the user not have to scroll to view all of the legend items and am trying to figure out how to achieve that.

Is there a way to specify a fixed width for the legend and have items wrap to a new line if there is not enough room for them? I didn’t see that as being an option for the standard legend template.

Also, is there a way to use multiple legends for a chart? Ideally it would be nice to split the series that are associated with annotation data into their own legend instead of mixing them in with the legend for the normal data. The SeriesInfo object doesn’t appear to have any property that would allow me to categorize the data.

Thanks,
Scott

Hi;

If I remember good, in a old version of SciChart it was possible to draw custom annotation in chart with a “pen”, like in Paint.

In the current version is it possible? And if yes, how do it please?

Regards;
Damien

When showing a new view, there are some annotations (from an AnnotationCollection) on the panel, but the RenderableSeries is empty. Is it possible to use the scrollbar to zoom in details of annotations?

Hi,

I am currently adding a Vertical Slice Modifier with just on Vertical Line inside of it.
The idea is to create a vertical cursor to display Y values for a given X value.
As my chart is a real time chart, I don’t want my cursor position changed expect on user interaction, I set to Relative the CoordinateMode property of my Annotation.

<s:VerticalSliceModifier Name="sliceModifier" ShowTooltipOn="Always" IsEnabled="True">
                    <s:VerticalSliceModifier.VerticalLines>
                        <s:VerticalLineAnnotation IsEditable="True" X1="0.5" Stroke="#D62D15" CoordinateMode="Relative"/>
                    </s:VerticalSliceModifier.VerticalLines>
                </s:VerticalSliceModifier>

The vertical line is correctly displayed at the centre of the surface but point markers and tooltips are not displayed at the line position, it seems the relative coordinate mode is not handle on this area.

Thanks for your help
Jean-Charles

I am trying to build an application with multiple charts on one screen (3) and each chart annotated with 20-25 annotations.
In total I have 6 FastLineRenderableSeries at once – 2 per chart.
I found serious performance issues after adding more than 10 annotations.

When a user presses a key I go to another set of data. Annotations are created on each data change. I create temporary collection and assign it to the surface annotations collection at once. I also suspend updates through Viewport Manager.

Creation of annotations does not seem to affect the performance, but the rendering of them does.

Most of them are derivatives of AxisMarkerAnnotation and apply a different label template. I tested adding standard Text Annotations instead, just to see whether the custom template had to do something with the performance drop, but it was more or less the same case.
The custom templates are also really simple, it is either a text block or a filled shape, always one component.

Do you have any advises for using a bigger number of annotations?
How to make their rendering faster?

When I remove all annotations the “scrolling” of data goes really smooth.

I am running out of ideas of how to improve.

Best regards,
Paulina

PS Is there any way to try out the other renders before buying a license?

I’ve seen lots of questions like that here but still can’t figure out how to work with UserControl in WPF and how can i dinamically arrange annotations on user events (lines, figures,text etc). Can you please provide links which may help to get started from scratch. Thank you!

Hi,

I’m trying to add a small image as an annotation to the chart, but I couldn’t make it work… most likely doing something wrong, but I can’t quite figure out how this should be done. This is the direction I went for:

public void AddIcon()
    {
        Image image = new Image();
        BitmapImage icon= new BitmapImage();
        icon.UriSource = new Uri(@"D:\icon.png", UriKind.Absolute);


        image.Source = icon;

        var annotation = new CustomAnnotation()
        {
            X1 = 0,
            Y1 = 0,
            Content = image,
        };
        ChartAnnotations.Add(annotation);
    }

What am I doing wrong? is there a proper and simple way to add image annotations to the chart in an MVVM manner?

Thank you!