CartesianCustomAnnotation annotations not showing up on chart

[David]

I have RadCartisianChart on a Window and on a button click I would like to add a vertical line at a particular channel (x-axis value) and label the line.  Here is the code for my button click event.

Please let me know if you know why the CartsianCustomAnnotation is now being displayed.  I've also provided a link to a zipped stripped-down example C# WPF project which demonstrates this: Telerik ChartView CartesianCusomAnnotation not display

01.private void Button_OnClick(object sender, RoutedEventArgs e)
02.    {
03.      Random rnd = new Random();
04.      int curChannel = rnd.Next(1, 1000);
05.
06.      CartesianGridLineAnnotation myLineAnnotation = new CartesianGridLineAnnotation();
07.      myLineAnnotation.Axis = radCartesianChart1.HorizontalAxis;
08.      myLineAnnotation.Value = curChannel;
09.
10.      myLineAnnotation.Stroke = System.Windows.Media.Brushes.Fuchsia;
11.      radCartesianChart1.Annotations.Add(myLineAnnotation);
12.
13.      var newKLMLabel = new CartesianCustomAnnotation();
14.      newKLMLabel.HorizontalAxis = radCartesianChart1.HorizontalAxis;
15.      newKLMLabel.VerticalAxis = radCartesianChart1.VerticalAxis;
16.
17.      var border = new Border();
18.      border.CornerRadius = new CornerRadius(4);
19.      border.Background = Brushes.Gray;
20.      border.Opacity = 0.9;
21.
22.      //var content = new TextBlock();
23.      var content = new Label();
24.      content.Content = "Channel " + curChannel.ToString();
25.      border.Child = content;
26.
27.      newKLMLabel.Content = border;
28.      newKLMLabel.HorizontalValue = curChannel;
29.      newKLMLabel.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
30.      newKLMLabel.VerticalValue = _chartVM.ParticleEdsSpectrum[curChannel].Counts;
31.
32.      newKLMLabel.Tag = "klmlabel";
33.
34.      newKLMLabel.Visibility = Visibility.Visible;
35.
36.      radCartesianChart1.Annotations.Add(newKLMLabel);
37.
38.    }

[Petar Marchev]

Hi David,

Thank you for the provided code snippet and project, I was able to run the app right away and reproduce the behavior in mind.

On the button click a new line annotation appears. The custom annotation is not visible. The reason for this is the VerticalValue, it is something like 129, when the range of the axis is (0 - 12000). This leads to the annotation being positioned just below the plot area, under the pan zoom bar, and the annotation gets clipped. You can set the ClipToPlotArea property to false and you will understand what is going on:

newKLMLabel.ClipToPlotArea = false;

I hope this helps.

Regards,
Petar Marchev
Telerik

 

 

[David]

Hi Petar,

I'm getting the labels to show up by setting ClipToPlotArea to false, but the labels are all still drawn very low on the plot no matter what I set the VerticalValue to.  I've re-written my code to add a label to the channel with the value (which is around 10,625)  and the label is still way at the bottom.

01.int curChannel = 1;
02.      uint maxCounts = 1;
03.      foreach (var specChan in _chartVM.ParticleEdsSpectrum)
04.      {
05.        if (specChan.Counts > maxCounts)
06.        {
07.          maxCounts = specChan.Counts;
08.          curChannel = specChan.Channel;
09.        }
10.      }
11.
12.
13.      CartesianGridLineAnnotation myLineAnnotation = new CartesianGridLineAnnotation();
14.      myLineAnnotation.Axis = radCartesianChart1.HorizontalAxis;
15.      myLineAnnotation.Value = curChannel;
16.      //myLineAnnotation.Value = (int)Math.Round(line.Energy, 0, MidpointRounding.ToEven);
17.      myLineAnnotation.Stroke = System.Windows.Media.Brushes.Fuchsia;
18.      radCartesianChart1.Annotations.Add(myLineAnnotation);
19.
20.      var newKLMLabel = new CartesianCustomAnnotation();
21.      newKLMLabel.HorizontalAxis = radCartesianChart1.HorizontalAxis;
22.      newKLMLabel.VerticalAxis = radCartesianChart1.VerticalAxis;
23.
24.      var border = new Border();
25.      border.CornerRadius = new CornerRadius(4);
26.      border.Background = Brushes.Gray;
27.      border.Opacity = 0.9;
28.
29.      var content = new TextBlock();
30.      content.Text = "Channel " + curChannel.ToString();
31.      border.Child = content;
32.
33.      newKLMLabel.Content = border;
34.
35.      newKLMLabel.Content = border;
36.      newKLMLabel.HorizontalValue = curChannel;
37.      newKLMLabel.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
38.      newKLMLabel.VerticalValue = _chartVM.ParticleEdsSpectrum[curChannel].Counts;
39.      newKLMLabel.VerticalContentAlignment = VerticalAlignment.Top;
40.      newKLMLabel.ClipToPlotArea = false;
41.
42.      newKLMLabel.Tag = "klmlabel";
43.
44.      newKLMLabel.Visibility = Visibility.Visible;
45.
46.      radCartesianChart1.Annotations.Add(newKLMLabel);

Any thoughts?

[Petar Marchev]

Hi David,

Well, looking at the project again I now see that you have two vertical axes. One of them has a Name LiveAxis and is declared to be the main vertical axis of the chart. You need this axis in order for the PanZoomBar to show, so you can zoom. The other is in the resources collection of the chart, it has a Key LiveAxis (the same as the Name of the previous one). Later, on the 59th row, you are setting this additional axis to the series, so the series uses the axis from the resources.

This leaves the main vertical axis of the chart with no series attached to it. This results in a no-range axis. So the axis does not have a range. Later when you create annotations, you do not specifically set the annotations' VerticalAxis. So the annotations try to work with the main axis. However, the main axis does not have a range and the annotation is not able to find a suitable vertical position. If you set the VerticalAxis of the annotation to be the axis from the resources, you would have no problems with this.

If possible, I suggest you do not use two axes at all. I am not sure if your actual application requires multiple axes, but if it doesn't I suggest you only use the main vertical axis of the chart.  I hope these explanations help.

Regards,
Petar Marchev
Telerik

 

 

[David]

Thank you so much for your help.  Removing the the 2nd definition of my Horizontal axis now allowed my labels to show up.