Tag: Annotations

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!

I am trying to add some annotations to my graph. The problem is that this function is called from a different thread so I get the following excepion:

I thried using an invoke on the main thread but this doesn’t help.

This is the code I use:

 var verticalLineAnnotation = new VerticalLineAnnotation
            {
                X1 = annotation.X,
                Tag = annotation,
                StrokeThickness = annotation.StrokeThickness,
                StrokeDashArray = annotation.StrokeDashArray,
                Stroke = annotation.Brush,
                ToolTip = annotation.LabelTooltip
            };

            var referenceDataAnnotation = annotation as ReferenceDataAnnotation;
            if (referenceDataAnnotation != null)
            {
                verticalLineAnnotation.ContextMenu = ChartContextDataTypesFactory.CreateContextMenus(referenceDataAnnotation.Type.Name, Application.Current.MainWindow);
            }

            if (IsChartFirst)
            {
                verticalLineAnnotation.AnnotationLabels = new ObservableCollection<AnnotationLabel>
                {
                    new AnnotationLabel
                    {
                        LabelPlacement = LabelPlacement.TopLeft,
                        FontSize = 12,
                        FontWeight = FontWeights.Normal,
                        Margin = new Thickness {Bottom = -5},
                        Text = annotation.LabelText
                    }
                };
            }
//This is the line where I get the exception
            ParentSurface.Annotations.Add(verticalLineAnnotation);

I am placing annotations at the top of every bar in a stacked bar graph (and a standard bar graph on another screen) showing the total of all the stacked bars by iterating through my data, generating the sum, and placing it at the correct x,y (an incredibly manual process that seems like there should be much easier to do but I found no other way to do it – if there is a better way, I would love to hear it, but that’s a secondary issue and not my current problem).

I also have a legend where the user can select / deselect series.

When the user selects/deselects a series from the legend, I need to hide all my annotations and then recreate them because the sums of the stacked bars has changed (or if no bars are showing, remove my annotation completely). My assumption is I could reiterate through my data and check series to see if they are visible (isVisible) and recalculate the sums and recreate the annotations (another very manual process but I can probably work it out).

My primary problem is I see no way for me to intercept that this legend event occurred. The series get hidden internally and I never have a chance to do anything with the annotations. It seems like this may be doable on other platforms but I’m at a loss on iOS. There is no delegate / block event handler / etc.

Any thoughts?

I downloaded the SciChartTeam SciChart version 6.4.0.13633 release from Git , thinking I would be able to get myself educated regarding Composite Annotations , which is something that has been requested by our field engineers.
The reference however given in the xaml file gives me :

Resources/ExampleSourceFiles/AnnotateAChart/CompositeAnnotations/CompositeAnnotationsView.xaml.txt

within the solution. That reference does not include any source files (see attached image)

Since Composite Annotations is fairly complex, code examples and a working example solution, showing Composite Annotations implemented would be extremely helpful for me. Is there a running example I can download / view/ interact with ?

Appreciate support in this matter

Thank you

Anders

Hi there.

It’s has been asked here:
https://www.scichart.com/questions/question/custom-annotation

So, Is it possible to draw dashed line annotation at the current version 1.2.3.982?

Best regards,
Sushynski Andrei

I need to update a lot of annotations. Not so much. Remove and add about 10-100 annotations per action. And it takes a lot of time. I’ve already tried all the recommendations with SusppendUpdates etc, but the result is the same.

I don’t need the flexibility of UIElements. I’m using it as markers only.

So, maybe it is possible to implement annotations as a series with a custom point marker. I need a vertical dashed line with text, like in screenshot. Is there a way to do it?

I’m making an app for curve-fitting a line to raw data, and I’d like to have a way for the user to manipulate the curve-fitted line (shown in pink below) in order to fine tune their results.

Ideally, after clicking a toolbar button the line would have a callout box around it similar to Microsoft Word’s Shape art. The different markers on the box would allow the user to rotate the line or change the shape.

I’m wondering if you have recommendations for built in classes to use or extend? Currently the line I want the user to be able to manipulate is a FastLineRenderableSeries. I understand one can draw vertical and horizontal annotation lines and then manipulate those, but don’t think I can use annotations since I want to be able to manipulate the shape of a data series.

Should I be trying to extend FastLineRenderableSeries to make it behave like an annotation, or extend baseannotation to make it draw as a data series?

Thanks,
Jesma Secord

Hi,

Can you please tell me how to change selection points of annotation?

Thanks in advance.

Regards,
Batyr

I add a LineAnnotation programmaticly to my surface and want to readjust it just like in the Examples Suite via clicking and draging the ends of the annotation.
As long as i dont use a Theme everything works fine. But when applying a custom theme the Manipulation points are not there anymore (and not only visualy, clicking at the end of the line also does not work. Furthermore the mousecursor does not change to a cross when hovering above the annotation end).

This is my Custom theme code:

<ResourceDictionary  x:Class="Reprocess.SciChartDisplay.CustomTheme"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    >       

<!--  *************************  -->
<!--  Colors and Brushes  -->
<!--  *************************  -->

<!--  Chart Brushes  -->
<SolidColorBrush x:Key="TickTextBrush" Color="Black"/>
<SolidColorBrush x:Key="MajorGridLineBrush" Color="LightGray"/>
<SolidColorBrush x:Key="MinorGridLineBrush" Color="LightGray"/>
<SolidColorBrush x:Key="SciChartBackground" Color="White"/>
<SolidColorBrush x:Key="GridBorderBrush" Color="#102A47"/>
<SolidColorBrush x:Key="GridBackgroundBrush" Color="Transparent"/>
<SolidColorBrush x:Key="RolloverLineBrush" Color="#33FD9F25"/>
<SolidColorBrush x:Key="CursorLineBrush" Color="#996495ED"/>
<SolidColorBrush x:Key="RubberBandFillBrush" Color="#33333399"/>
<SolidColorBrush x:Key="RubberBandStrokeBrush" Color="#77999999"/>
<SolidColorBrush x:Key="LegendBackgroundBrush" Color="AliceBlue"/>

<SolidColorBrush x:Key="LabelBackgroundBrush" Color="#AA6495ED"/>
<SolidColorBrush x:Key="LabelBorderBrush" Color="#FF6495ED"/>
<SolidColorBrush x:Key="LabelForegroundBrush" Color="Black"/>

<SolidColorBrush x:Key="TextAnnotationForeground" Color="#EEEEEE"/>
<SolidColorBrush x:Key="TextAnnotationBackground" Color="#AA6495ED"/>

<Color x:Key="AxisBandsFill">White</Color>

<!--  Default Series Colors  -->
<Color x:Key="UpWickColor">Gray</Color>
<Color x:Key="DownWickColor">Gray</Color>
<SolidColorBrush x:Key="UpBodyBrush" Color="Gray"/>
<SolidColorBrush x:Key="DownBodyBrush" Color="Gray"/>

<Color x:Key="UpBandSeriesLineColor">#22117711</Color>
<Color x:Key="DownBandSeriesLineColor">#22111111</Color>
<Color x:Key="UpBandSeriesFillColor">Black</Color>
<Color x:Key="DownBandSeriesFillColor">Red</Color>

<LinearGradientBrush x:Key="MountainAreaBrush" StartPoint="0,0" EndPoint="0,1">
    <GradientStop Color="Gray" Offset="0"/>
    <GradientStop Color="#000710" Offset="1"/>
</LinearGradientBrush>

<Color x:Key="MountainLineColor">Black</Color>
<Color x:Key="LineSeriesColor">Black</Color>
<Color x:Key="ColumnLineColor">#11FFFFFF</Color>
<SolidColorBrush x:Key="ColumnFillBrush" Color="#11FFFFFF"></SolidColorBrush>

<Brush x:Key="OverviewFillBrush">White</Brush>


<Brush x:Key="ScrollbarViewportBackgroundBrush">White</Brush>

<LinearGradientBrush x:Key="DefaultColorMapBrush">
    <GradientStop Offset="0" Color="White"/>
    <GradientStop Offset="0.5" Color="White"/>
    <GradientStop Offset="1" Color="White"/>
</LinearGradientBrush>

Any suggestions?