Tag: Annotations

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);

Hi,

Was hoping you could point me in the right direction. I’m trying to create horizontal line annotations on demand using MVVM but have become stuck. I’ve have them working in MVVM when the chart loads but not when a button is clicked although I have achieved this using code behind.

I’ve tried using an observable collection of AnnotationCollection type but am struggling to add the horizontal lines annotations to it as they are of a different type.

Any pointers in the right direction would be much appreciated!

Thanks,
Tim

Example of MVVM

TradeAnnotations = CreateHorizontalAnnotations();

private AnnotationCollection _annotations;

    public AnnotationCollection TradeAnnotations
    {
        get { return _annotations; }
        set
        {
            _annotations = value;
            OnPropertyChanged("TradeAnnotations");
        }
    }

    private static AnnotationCollection CreateHorizontalAnnotations()
    {
        //var annotations = new AnnotationCollection();

        var annotations = new AnnotationCollection();

        Color strokeColor = (Color)ColorConverter.ConvertFromString("#008B45");
        Brush strokeBrush = new SolidColorBrush(strokeColor);

        HorizontalLineAnnotation annotation = new HorizontalLineAnnotation();

        annotation.ShowLabel = true;
        annotation.LabelPlacement = LabelPlacement.Axis;
        annotation.HorizontalAlignment = HorizontalAlignment.Stretch;
        annotation.IsEditable = true;
        annotation.SnapsToDevicePixels = true;
        annotation.Stroke = strokeBrush;

        annotation.X1 = DateTime.Now;
        annotation.Y1 = 129;

        annotations.Add(annotation);

        return annotations;          
    }

Example of code behind

        private void CreateHorizontalAnnotations(object sender, System.Windows.RoutedEventArgs e)
    {
        //var annotations = new AnnotationCollection();

        var annotationCollection = new AnnotationCollection();

        Color strokeColor = (Color)ColorConverter.ConvertFromString("#008B45");
        Brush strokeBrush = new SolidColorBrush(strokeColor);

        HorizontalLineAnnotation annotation = new HorizontalLineAnnotation();

        annotation.ShowLabel = true;
        annotation.LabelPlacement = LabelPlacement.Axis;
        annotation.HorizontalAlignment = HorizontalAlignment.Stretch;
        annotation.IsEditable = true;
        annotation.SnapsToDevicePixels = true;
        annotation.Stroke = strokeBrush;

        annotation.X1 = DateTime.Now;
        annotation.Y1 = 129;

        this.priceChart.Annotations.Add(annotation);
    }

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

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 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,

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!

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,

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

Thanks in advance.

Regards,
Batyr

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

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?

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?

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

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 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 have an application for which the VerticalLineAnnotation is a near perfect fit. However, to make it easier to add these annotations from the AnnotationCreatioinModifier, I would like to derive a new annotation class from VerticalLineAnnotation with a couple of new dependency properties, and new label style using these properties. Is this possible? I’ve looked through the forum and existing examples, and can’t find relevant examples. Can you point me in the right direction?

Bill

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?

I’m trying to create a few ChartSurface’s which show same elements but with different visible ranges.
If i share DataSeries by binding to SeriesSource this works. But if i try to binding Annotations to a few ChartSurface’s i see annotations only on last chart. If i manually create copy of annotations that everything works but takes a long time.
Is there any way to binding Annotations to a few Charts?

To whom this may concern:

I am following up to an issue that I posted a few years ago: https://www.scichart.com/questions/wpf/resizing-custom-annotations

I’ve attached a sample project that outlines what I am trying to accomplish. It is a simple scatter chart with randomized points in which I am trying to draw a rotatable ellipse annotation around the points.

The annotation inherits the “BoxAnnotation” class and replaces it’s template with an ellipse that is shaped to within the bounds of the annotation. This ellipse can be rotated by dragging the ellipse with the right-click button of the mouse. Upon doing so, in order to ensure the ellipse still maintains its shape when zooming in, the ellipse is converted to a geometric path. (Shown when the color of the ellipse changes from red to green.) Like this, when re-sizing the ellipse, it maintains its shape. After re-sizing, if the user wants to rotate the ellipse again, the original Ellipse UIElement re-surfaces and the Path UIElement is hidden. The user can then rotate the ellipse, which is in turn rendered back to a Path UIElement once again. The bounds of the annotation are modified to ensure the ellipse and its geometric path maintains its shape when switching between the Ellipse and the Path UIElements.

The issue is when re-sizing the annotation, and then attempting to rotate the ellipse again, the ellipse is clipped by the bounds of the annotation, even though “ClipToBounds” is set to false (in the code-behind). Unfortunately, I can’t find a pattern for which this occurs, and I have no solution to this issue. Examples of the clipped and non-clipped ellipses are shown in the attached images.

Hopefully the attached project is easy to understand. Can you please advise?

Thank you kindly!

— Ari

EDIT: Code attached as .ZIP file