WPF Charting Documentation - SciChart WPF Charts SDK v5.x
MVVM Annotations API

In addition to the SeriesBinding MarkupExtension for binding a SciChartSurface to a collection of Viewmodels representing chart series, SciChart also features the AnnotationsBinding MarkupExtension: for binding to a collection of AnnotationViewModels.

To use this API, do the following:

AxisBinding View
Copy Code
 <s:SciChartSurface Annotations="{s:AnnotationsBinding Annotations}">

 </s:SciChartSurface>

Now in the ViewModel we need collections for the YAxes and XAxes. We update our MainViewModel like this:

AxisBinding ViewModel
Copy Code
public class MainViewModel : BindableObject
{
    private ObservableCollection<IAnnotationViewModel> _annotations = new ObservableCollection<IAnnotationViewModel>();
       
    public MainViewModel()
    {
        Annotations.Add(new LineAnnotationViewModel()
        {
           X1 = 1, X2 = 2, Y1 = 1, Y2 = 2,
           XAxisId = AxisBase.DefaultAxisId,
           YAxisId = AxisBase.DefaultAxisId,
           CoordinateMode = AnnotationCoordinateMode.Relative,
           DragDirections = XyDirection.XYDirection,
           ResizeDirections = XyDirection.XYDirection,
           StrokeThickness = 2, 
           Stroke = Colors.Red,
        });
        ... 
    }
   
    public ObservableCollection<IAxisViewModel> Annotations {  get { return _annotations; } }                
}

 

Applying styles to Annotations

Axis may be styled using a similar technique to the one presented for RenderableSeries. Simply declare a Style in XAML with a stylekey and set BaseAnnotationViewModel.StyleKey property.

 

Declaring Custom Annotationswith MVVM

Similar to Series, you can declare a custom class inheriting BaseAnnotationViewModel. Next override the ViewType property to declare the type of Annotation to create when this ViewModel is discovered. Finally, make sure you declare a style in your view based on our default styles to apply to it.

 

Further Reading

For further reading on how to use the Annotations MVVM API, as well as a code sample on creating and declaring custom annotations with MVVM, see our Adding Annotations in MVVM Tutorial.

 

 

 

 


SCICHART ® is a Registered Trademark in the UK, US and EEC. Copyright SciChart Ltd 2011-2018.

Email us to give feedback!