Show adornments for specific points only

Hello,

If a data point in a LineSeries/FastLineSeries has empty points on both its left and right side, the user won't be able to see the point. This can be solved by using adornments.

Is it possible to show adornments ONLY for the data points that I just described (points that would otherwise be invisible due to empty neighbours)?


Best regards,
Marcus

1 Reply 1 reply marked as answer

DD Devakumar Dhanapoosanam Syncfusion Team June 5, 2020 07:09 AM UTC

Hi Marcus Johansson, 
 
Greetings from Syncfusion. 
 
We have analyzed your query and we can achieve your requirement showing the adornment label for specific points by using the LabelTemplate property of the ChartAdornmentInfo as per the code snippet below. 
 
C#: 
 
DataTemplate template = new DataTemplate(); 
template.DataType = typeof(StackPanel); 
 
FrameworkElementFactory stackpanel = new FrameworkElementFactory(typeof(StackPanel)); 
stackpanel.SetValue(StackPanel.OrientationProperty, Orientation.Horizontal); 
 
FrameworkElementFactory textblock = new FrameworkElementFactory(typeof(TextBlock)); 
textblock.SetBinding(TextBlock.ForegroundProperty, new Binding("Interior")); 
textblock.SetValue(TextBlock.FontWeightProperty,  FontWeights.Bold); 
textblock.SetValue(TextBlock.HorizontalAlignmentProperty, HorizontalAlignment.Center); 
textblock.SetValue(TextBlock.VerticalAlignmentProperty, VerticalAlignment.Center); 
textblock.SetValue(TextBlock.MarginProperty, new Thickness(0, 0, 0, 0)); 
 
AdornmentLabelConverter labelConverter = new AdornmentLabelConverter(); 
Binding binding = new Binding(); 
binding.Converter = labelConverter; 
textblock.SetBinding(TextBlock.TextProperty, binding); 
stackpanel.AppendChild(textblock); 
 
//set the visual tree of the data template 
template.VisualTree = stackpanel; 
 
ChartAdornmentInfo adornmentInfo = new ChartAdornmentInfo() 
{ 
                ShowLabel = true, 
                LabelPosition = AdornmentsLabelPosition.Center, 
                AdornmentsPosition = AdornmentsPosition.Top, 
                ShowConnectorLine = true, 
                ConnectorHeight = 10, 
                SegmentLabelContent = LabelContent.LabelContentPath, 
                LabelTemplate = template 
}; 
 
Style style = new Style(typeof(Path)); 
style.Setters.Add(new Setter(Path.StrokeProperty, Brushes.Transparent)); 
adornmentInfo.ConnectorLineStyle = style; 
series1.AdornmentsInfo = adornmentInfo; 
 
 
C#: 
public class AdornmentLabelConverter : IValueConverter 
{ 
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
        { 
            ChartAdornment adornment = value as ChartAdornment; 
            Model model = adornment.Item as Model; 
 
            if (model != null) 
            { 
                return model.YValue < 10 ? model.YValue.ToString() : string.Empty; 
            } 
 
            return value; 
        } 
 
        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
        { 
            return value; 
        } 
} 
 
XAML: 
<syncfusion:LineSeries x:Name="series1" ItemsSource="{Binding Data}" 
                                   XBindingPath="XValue" YBindingPath="YValue" 
                                   Label="LineSeries"/> 
 
Please download the sample from the below link, 
 
 
 
Please let us know if you need any further assistance on this. 
 
Regards, 
Devakumar D 


Marked as answer
Loader.
Up arrow icon