SciChart® the market leader in Fast WPF Charts, WPF 3D Charts, and now iOS Charting & Android Chart Components

Welcome to the SciChart Community Forums!

Please use the forums below to ask questions about SciChart. Take a moment to read our Question asking guidelines on how to ask a good question and our support policy

We also have a tag=SciChart on where you can earn rep for your questions!

0 votes

I have a strip chart (see attached image), which uses VerticalLineAnnotation to mark events. I add my own AnnotationLabel with the Text showing the event id, and a ToolTip with detailed event information. I’m currently setting the LabelPlacement as Axis. I like the look of that AnnotationLabel style, but I’d really like it to be above the plot so it doesn’t clutter up the axis. Is there a nice way to do this?

0 votes

1) About VerticalLineAnnotation, when I move the vertical line, which event I can use to get real time data?
2) Do the chart lib have the full method to calculate the Fast Fourier Transformation?

0 votes
0 answers

Hi all,

As the title indicates, I am trying to get mouse cursor position (Coordinates) from a SciChartSurface in MVVM manner.

I have lots of data bindings to my chart properties in my View Model in the background. This following snipped is a copy of my XAML code in which I have all the data bindings set:

<sci:SciChartSurface Grid.Row="0" Grid.Column="0"
                         RenderableSeries="{Binding SciChartSeriesViewModels}"     
                         YAxes="{Binding SciChartYAxesCollection,Mode=TwoWay}"                                         
                         Annotations="{Binding ChartAnnotations}"                                     
                         ChartModifier ="{Binding ChartModifierGroup}"
                         Visibility="{Binding ChartVisibility}">

            <sci:TimeSpanAxis AxisTitle="Time"
                              AutoRange="Once" GrowBy="0.03,0.001"


As can be seen from the code above, the ChartModifier property is one of the items that has Data binding to an instance of a ModiferGroup I have created in my View-Model in the background. The following code is a method that adds members to that ModiferGroup (called ChartModiferGroup in my View-Model):

 private void CreateChartModifiers()
        var rubberBandXyZoomModifier = new RubberBandXyZoomModifier
            ExecuteOn = SciChart.Charting.ChartModifiers.ExecuteOn.MouseLeftButton,
            RubberBandFill = (SolidColorBrush)(new BrushConverter().ConvertFrom("#33FFFFFF")),
            RubberBandStroke = Brushes.SteelBlue, 
            RubberBandStrokeDashArray = new DoubleCollection {2.0, 2.0}

        var zoomPanModifier = new ZoomPanModifier
            ExecuteOn = SciChart.Charting.ChartModifiers.ExecuteOn.MouseMiddleButton,
            ClipModeX = SciChart.Charting.ClipMode.None

        var yAxisDragModifier = new YAxisDragModifier
            DragMode = SciChart.Charting.AxisDragModes.Scale

        var xAxisDragModifier = new XAxisDragModifier
            DragMode = SciChart.Charting.AxisDragModes.Pan

        var mouseWheelZoomModifier = new MouseWheelZoomModifier();

        var zoomExtentsModifier = new ZoomExtentsModifier
            ExecuteOn = SciChart.Charting.ChartModifiers.ExecuteOn.MouseDoubleClick

        var cursorModifier = new CursorModifier
            ReceiveHandledEvents = true,
            ShowAxisLabels = false

        var probeline = new VerticalLineAnnotation()
            Stroke = Brushes.LightSlateGray,
            IsEditable = true,
            ShowLabel = true,
            LabelPlacement = LabelPlacement.Axis,
            Visibility = Visibility.Visible,
            IsHidden = false,
            IsEnabled = true,
            X1 = TimeSpan.FromMilliseconds(-100),
            YAxisId = "Triggered",
            StrokeDashArray = new DoubleCollection { 2.0,2.0},
            StrokeThickness = 1

        var verticalSliceModifier = new VerticalSliceModifier
            IsEnabled = true,
            ShowAxisLabels = true,
            Style = probeline.Style


What I am trying to do next, is to add functionality in my application, such that I can add more VerticalSliceModifiers to my ChartModifierGroup when a button is pressed. In order to do that, I will require having access to the Mouse cursor position of my SciChartSurface to set the X1 property of the VerticalLineAnnotation, that would be used for the VerticalSliceModifiers (to be created).

In simple words, every time I press a button, I need the position of the mouse pointer to get captured and used as the location of the new VerticalSliceModifer that I am going to create.

I have already read many of the examples and documentation of Sci-Chart such as: Vertical Slice Tooltips Example. However, in this example, the mouse pointer location is accessed is under the xaml.cs and not inside an actual View-Model.

I was wondering if anybody could let me know how I can get access to my SciChartSurface mouse pointer position using true MVVM model.

0 votes

I am have a vertical stacked chart setup which shares the same x- axis ranges. I am trying to find a way to add vertical lines in both the charts at once and further I need the vertical lines to be dragged in sync. When one vertical line annotation is dragged, I need the same movement to happen in the other chart as well. I can share a prototype if you want. Please suggest a solution.

0 votes
0 answers


I’m trying to enable the use of multiple VerticalLineAnnotations and show the corresponding SeriesInfo in an extra legend to the user. Utilizing the RolloverModifier Tooltips example, this works quite easily for the position and values of the VerticalLineAnnotations. However, I would like to show differences (X and Y) between the values of two VerticalLineAnnotations in the same manner.

My approach was to subclass ChartDataObject and add an ObservableCollection of a custom class (SeriesDifferenceInfo) providing properties, which exhibit DeltaX and DeltaY for binding in the surface. For keeping this collection up to date when adding or removing a VerticalLineAnnotation, I registered for the CollectionChanged event of SeriesInfo in my subclassed ChartDataObject and wanted to update the Collection of SeriesDifferenceInfo subsequently. But somehow this event appears not to be triggered on a change in the list of SeriesInfo. Am I doing something wrong or is this intended behaviour? Of course, I could simply call a method UpdateDifferenceCollection(), when adding/removing a VerticalLineAnnotation, but is this really neccessary?

Also, the next problem is triggering PropertyChanged for the DeltaX and DeltaY values when the values of one SeriesInfo changed. I guess this could be done by listening to e.g. a drag event of VerticalLineAnnotation, but is there a more straightforward way to do this?

Best regards

0 votes

I did modify this CustomAnnotationChartModifier. I added a databinding to bing the ShowLabelProperty to the IsSelectedProperty.

    // Recreate all annotations, called when LabelsSource property changes or when the
    // CustomAnnotationChartModifier is attached to the parent surface
    private void RebuildAnnotations() {
        if (base.ParentSurface == null || LabelsSource == null)
        var annotationCollection = base.ParentSurface.Annotations;
        foreach (var item in LabelsSource) {
            var vla = new VerticalLineAnnotation();
            vla.DataContext = item;
            vla.SetBinding(AnnotationBase.X1Property, new Binding("X1") { Mode = BindingMode.OneWay });
            // bind ShowLabelProperty
                new Binding("IsSelected") { RelativeSource = RelativeSource.Self, Mode=BindingMode.OneWay });
            vla.IsEditable = this.IsEditable;
            // after manipulation: write X1Property back to Viewmodel 
            vla.DragEnded += Annotation_DragEnded;
            vla.LabelPlacement = LabelPlacement.Top;
            // test to set directly ShowLabel = (bool)e.NewValue;
            //vla.Unselected += annotation_SelectionChanged;
            //vla.Selected += annotation_SelectionChanged; 
            if (this.MarkerManipulatedCommand != null)
                vla.ManipulationCompleted += new EventHandler<ManipulationCompletedEventArgs>(manipulationCompleted_EventHandler);

    private void annotation_SelectionChanged(object sender, EventArgs e) {
        var vla = sender as VerticalLineAnnotation;
        if (vla == null) return;
        vla.ShowLabel =vla.IsSelected;

Result: Select the annoation will show the label. Unselect will not remove the label.
I did try the unselected and selected-event to do the same on other way ->same result.
I can see also that each new selection lighter the label (is it shown more than one time?).

How can I add ToolTipLabel inside that CustomAnnotationChartModifier to see the y-values?


0 votes

I am building a real-time graph with CategoryDate X Axis and Numeric Y Axis. I found it hard to understand the Annotation API’s regarding the X and Y positions.

Looking at AnnotationsAreEasyFragment, it draw a Horizontal line of (seemingly) full width. it declares

    .withPosition(7d, 2.8d)
    .withStroke(2, ColorUtil.Orange)

i can under Y = 2.8d, but what is the X=7d for? and in the next Horizontal line which is short, it declares .withPosition(5d, 3.2d)?? X=5d and X=7d gives such a big difference.

Since i am using CategoryDateAxis, referring to InteractionWithAnnotationsFragment to draw a vertical line at a specific date/time, there is a short line vertical line on 3rd Dec with the code


Since its a date axis, i would expect it to accept a Date.class (or long in millis) instead of .withX1(20). It doesnt even make sense! How exactly do i create full height vertical line at a specific date/time?

  • abc def asked 2 years ago
  • last active 2 years ago
0 votes

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?


1 vote

Hellow there,

I have this code for vertical lines of a graph binding to VM with INotifyPropertyChanged implemented.

                                    <s:VerticalLineAnnotation  X1="{Binding IndexFirstBeep, UpdateSourceTrigger=PropertyChanged}"  >
                                    <s:VerticalLineAnnotation  X1="{Binding IndexSecondBeep, UpdateSourceTrigger=PropertyChanged}"  >

At first I can see both vertical lines but after switching to another tab item and coming back, one (sometimes both) of the vertical lines disappears. If I double click the graph it reappears. This happens to almost all of my graphs. Here is how I set up my VM

private int indexFirstBeep = 6;
    public int IndexFirstBeep
            return indexFirstBeep;
            indexFirstBeep = value;

I have also noticed it happening to the renderables series of some of my graphs after switching their visibility.

Am on v4.0.30319

Please help.

0 votes

I have both a VerticalLineAnnotation and LineAnnotation. When I drag my VerticalLineAnnotation around, the onAnnotationPositionChanged event is fired. The partial stack trace is attached. Once the Make Visible method is called, it goes through until it affects the LineAnnotation’s visiblity property that it has no direct binding too. If I change the visibility property that the LineAnnotation’s visibility is bound to, then moving the VerticalLineAnnotation changes that new property.

Why is this happening?

  • Ryan Woods asked 2 years ago
  • last active 2 years ago
0 votes

Is there a way to find out what the Y value is where the VerticalLineAnnotation intersects the line chart that it is crossing over?

Edit: The attached image shows these intersections. I would like to know how I can get a hold of those y values.

  • Ryan Woods asked 2 years ago
  • last active 2 years ago
1 vote


is it possible to make the Touch Area of a SliceModifiers’ LineAnnotation bigger?

Right now the area has the same size as the MouseClick area, which is a bit too small if you want to drag a modifier with your finger.

Maybe I didn’t look hard enough, but I couldn’t find an overridable HitTest Method in VerticalSliceModifier/VerticalSliceModifierBase.
Or is it possible to override a HitTest (like the “IsPointWithinBounds()” method?) in the LineAnnotation class and use this custom VerticalLineAnnotation as my VerticalLine?

Thank you very much!



  • dowe asked 2 years ago
  • last active 2 years ago
1 vote

I want to display a point as a decimar separator in numeric values. I have achieved this in chart axis and vertical slices tooltips, creating a custom NumericLabelProvider (see attached picture). How can I do the same with vertical slices xacis labels? (in the picture attached, note that every numeric value has a point as a decimar separator, but vertical slice label has a comma). I have defined LabelTextFormatting of the slice with “#.##E+0”, but it doesn’t work.

Thanks in advance

Regads, Juan

0 votes

I am trying to customize the verticalLineAnnotation , kinda same as this question

all works as intended except I cant change the color of the point which is currently orange (see the photo). enter image description here Would wish to have the orange dots transparent.
Would you please help.

Thank in advance.


1 vote

I am trying to get a right charting control for my boss , excuse me if am not using the right terms I am new to both WPF and SciCharts. Based on this example;component/Examples/IWantTo/InspectDatapoints/SeriesVerticalSlicesExample.xaml , I am having the following difficulties:

  1. Changing label background color of a VerticalLineAnnotation ( the one in blue lying below the X axis in the example)
    I have been trying to figure out how to change the Vertical Slices’ labels background color (or make the label’s box transparent in order to see only the labels’ values and not the color around the label) but am not gettting a way out.

  2. Position the Curve – ‘Vertical slice’ intersection point y-axis value at the top end of the slice ( from the example, assuming i have only one curve say Curve A, the label ‘Curve A : 0.69’ shouldn’t appear right at the point of intersection between the curve and the slice but at the top end of the slice)

Would someone help please. Thank you in advance.

0 votes


I have a VerticalLineAnnotation that can be dragged over the chart by clicking and dragging on the line itself. (See attached image). The problem is, whenever I put the chart in front of a user, they try to drag by clicking on the label (the blue label with the time in the image).

How can I make this label draggable like the line?


0 votes

I have a set of ChartModifiers on my SciChartSurface, carefully configured to work together like so:

        <s:LegendModifier x:Name="LegendModifier" />
        <s:ZoomPanModifier ExecuteOn="MouseRightButton" ClipModeX="None" />
        <s:RubberBandXyZoomModifier ExecuteOn="MouseLeftButton" />
        <s:SeriesSelectionModifier />
        <s:ZoomExtentsModifier ExecuteOn="MouseDoubleClick" />
        <s:MouseWheelZoomModifier />

I also have a pair of VerticalLineAnnotations, which I create in the C#. These are used to select points on the series that has been selected with the SeriesSelectionModifier.

The problem is that after the sliders are dragged, the mouse up event causes the selected series to be unselected. How can I prevent this from happening?

1 vote

I think what I’m looking for is some sort of DragCompleted type event.

I’ve already overridden the VerticalLineAnnotation in order to force the bar to only jump to existing coordinates. So what I want to do now is go off and get more data related to that coordinate value when the user has finished dragging the bar.

I haven’t got a lot of time to implement anything complex so for now I can get away with a button on a tool bar to press after the drag. Not very slick I know, but if there’s an easy way to do it then I’m keen to hear about it đŸ™‚


1 vote

Is there any example of how to modify the intersection point template of where a verticallineannotation intersects say a fastlinerenderableseries?

The default is simply the value with a gray background.
In the “Series Vertical Slices” example I can see it includes the series name, but I don’t see anything in the “Source Code” that even asks for it.

Thanks for any help!

  • dwoerner asked 3 years ago
  • last active 3 years ago
1 vote

How to create custom annotation which has BoxAnnotation with a VerticalLine Annotation at one end.

At present I’m achieving this by creating both annotations and synchronizing them in ChartModifier.
Look at the attached image where you can see two BoxAnnotations both having a VerticalLineAnnotation at one end. I’m disabling editing for BoxAnnotation and enabling editing only for VerticalLineAnnotation.

When VerticalLineAnnotation is dragged in X-Direction, I get the X1 value from it and manually set it to BoxAnnotations X2.

This is not good implementation. I can see lag between sync events. Is it possible to create a custom annotation which incorporates both Box and Vertical line annotations ? Or is it possible to set IsEditing for BoxAnnotations One End only ?

1 vote

Hi, I’m trying to position vertical line annotations on a chart. I want to position them on a visible part of the chart, but I need to use the Absolute coordinate mode as I want the annotation to move with the data as the chart is panned or zoomed.

My question is then: how can I find the currently visible extents of the X axis? If the chart is zoomed or panned I need to know what the left and rightmost visible X-axis values are (independent of the data).

1 vote

I can’t seem to directly set the font color of a VerticalLineAnnotation.
I found this link which shows how to set it directly, but that doesn’t seem to do anything either (is it broken again?)
Here is some of my code:

    <Style x:Key="sliceStyle" TargetType="s:VerticalLineAnnotation">
        <Setter Property="ShowLabel" Value="True"/>
        <Setter Property="Stroke" Value="#ff4"/>
        <Setter Property="IsEditable" Value="True"/>
        <Setter Property="Foreground" Value="#225"/>
        <Setter Property="LabelPlacement" Value="Axis"/>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Stroke" Value="Blue"/>
                                <s:VerticalSliceModifier Name="sliceModifier">
                                        <s:VerticalLineAnnotation Style="{StaticResource sliceStyle}" X1="1" />
                                        <s:VerticalLineAnnotation  X1="3" Stroke="#ff4" IsEditable="True" LabelPlacement="Axis" ShowLabel="True" >
                                            <s:AnnotationLabel LabelPlacement="TopRight" Text="initially3" Foreground="Green"/>

Thanks for any insight!

  • dwoerner asked 3 years ago
  • last active 3 years ago
Showing 22 results
This template supports the sidebar's widgets. Add one or use Full Width layout.