Pre loader

How to change the label background color of a VerticalLineAnnotation

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums


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.

  • You must to post comments
Best Answer

Hi there,

Thanks for your request. Concerning the first question, you should define the label in Xaml instead using the default one:

            <!-- When defining your own AnnotationLabel, set ShowLabel=False -->
            <s:VerticalLineAnnotation ... ShowLabel="False">

                <s:AnnotationLabel LabelPlacement="Axis" Background="..." />


The label’s text is bound to show X1 by default, but you may change it setting any value to the Text property.

Regarding the second question, I’m not sure if it’s possible to achieve out of the box. To clarify, may I ask you to attach a screenshot showing the desired behavior please?

Best regards,

  • Kilosa Magali
    Hi, See what i get with the solution you proposed and the details of the second question here below please.
  • You must to post comments

Kilosa —

A solution I just found that might be helpful if you’re using codebehind or MVVM

First code a new AnnotationLabel, which is similar to the properties of a TextBoxAnnotation

var sliceLabel = new AnnotationLabel
    Background = // Background Color
    Foreground = // Text Color
    LabelPlacement = // Label Placement (analogous to the LabelPlacement already in the VerticalSliceAnnotation class
    BorderBrush = // Border Color
    BorderThickness = // Border Thickness
    CornerRadius = // Corner Radius if desired
    Text = // Label Text
    Height = 38 // Should be about the same height and width of the built-in label style
    Width = 70

Then code your label

var verticalSlice = new VerticalLineAnnotation
    Stroke = color,
    X1 = time,
    IsEditable = true,
    markerType = markerType

Then simply add your sliceLabel to your verticalSlice’s “AnnotationLabels” collection:


And it should show up just fine.

  • You must to post comments

Thanks for your response and sorry for a late reply (been having stuffs in between). Here is what I get with the solution you gave me:

enter image description here

and its code

 <s:VerticalLineAnnotation Name="curseur_Stabilogramme" Style="{StaticResource sliceStyle}" X1="10"  MouseLeftButtonUp="MouseButtonEventHandler_curseur_Stabilogramme""  >
   <s:AnnotationLabel LabelPlacement="Axis" Background="#FF333333"  BorderBrush="#FF333333" BorderThickness="0" />

Looks like the border is linked to the vertical line, what I would like to have is just a number showing and not that blue border.

For the second question, here is what I would like to get:

enter image description here

i.e the intersection values should be somewhere at the top ( see the green pointer) but the point (circled in yellow) can stay right where it is.

Thanks and looking forward to reading from you.

  • Andrew Burnett-Thompson
    Hi Kilosa, regarding #1: If you define your own AnnotationLabel, then you must set ShowLabel = false <s:VerticalLineAnnotation Style="{StaticResource sliceStyle}" X1="1" ShowLabel="False"> <s:VerticalLineAnnotation.AnnotationLabels> <s:AnnotationLabel Background="Transparent" BorderBrush="Transparent" BorderThickness="2"/> </s:VerticalLineAnnotation.AnnotationLabels> </s:VerticalLineAnnotation> Regarding #2, unfortunately it is not possible to alter the placement of the Rollover tooltips at this time. It is possible via a code change, and we could guide you how if you were to purchase a source-code license. Best regards, Andrew
  • You must to post comments
Showing 3 results
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies