Setting the color of bar series

[Purna]

My XAML is as follows

 

<telerik:RadCartesianChart Name="chart" Palette="Ground" Canvas.Left="20" Width=" 1250" Canvas.Top="130" Height=" 550" Background="White" >
                        <telerik:RadCartesianChart.HorizontalAxis>
                            <telerik:CategoricalAxis />
                        </telerik:RadCartesianChart.HorizontalAxis>

                        <telerik:RadCartesianChart.VerticalAxis>
                            <telerik:LinearAxis HorizontalAlignment="Right" />
                        </telerik:RadCartesianChart.VerticalAxis>
 </telerik:RadCartesianChart>

 

 

And in the code behind I am adding the series dynamically

Dim style As New Style(GetType(Border))
style.Setters.Add(New Setter(Border.BackgroundProperty, New SolidColorBrush(Colors.LightGray)))

 

 For i As Integer = 0 To ChartDataModel.Data(0).Values.Length - 1
                    Dim barSeries As New Telerik.Windows.Controls.ChartView.BarSeries()
                    barSeries.CategoryBinding = New PropertyNameDataPointBinding() With {.PropertyName = "Title"}
                    Dim k As Integer = i
                    barSeries.ValueBinding = New GenericDataPointBinding(Of OC_ChartData, Double) With {.ValueSelector = Function(Selector) Selector.Values(k)}
                    barSeries.SetBinding(ChartSeries.ItemsSourceProperty, New Binding("Data"))
                    barSeries.CombineMode = Telerik.Charting.ChartSeriesCombineMode.Stack
                    barSeries.StackGroupKey = "Group" & i.ToString
                    'If i = 0 Then barSeries.DefaultVisualStyle = style
                    chart.Series.Add(barSeries)
                Next
                chart.DataContext = ChartDataModel

 

1. The color of Series 0 is not set. Can you point what is going wrong

2. I want to have the tool tip to contain the actual Y value. How can I get the Y value of a particular bar.

 

[Purna]

3. Also I would like to get the legend displayed. How can I enable the legend.

[Purna]

Added the following line (in bold) to display legend

But the legend is still not displayed

For i As Integer = 0 To ChartDataModel.Data(0).Values.Length - 1
                    Dim barSeries As New Telerik.Windows.Controls.ChartView.BarSeries()
                    barSeries.CategoryBinding = New PropertyNameDataPointBinding() With {.PropertyName = "Title"}
                    Dim k As Integer = i
                    Dim strVal As String = (Function(Selector) Selector.Values(k)).ToString
                    barSeries.ToolTip = IIf(i = 0, (dtFYEnd.Year - 1).ToString, IIf(i = 1, dtFYEnd.Year.ToString, "Budgeted"))
                    barSeries.ValueBinding = New GenericDataPointBinding(Of OC_ChartData, Double) With {.ValueSelector = Function(Selector) Selector.Values(k)}
                    barSeries.SetBinding(ChartSeries.ItemsSourceProperty, New Binding("Data"))
                    barSeries.CombineMode = Telerik.Charting.ChartSeriesCombineMode.Stack
                    barSeries.StackGroupKey = "Group" & i.ToString
                    barSeries.LegendSettings = New SeriesLegendSettings With {.Title = "Test" & i.ToString}
                    barSeries.FontSize = 10

                    Dim style As New Style(GetType(Border))
                    Dim colorBar As Color = IIf(i = 0, Colors.DarkOrange, IIf(i = 1, Colors.DarkBlue, Colors.DarkGreen))
                    style.Setters.Add(New Setter(Border.BackgroundProperty, New SolidColorBrush(colorBar)))
                    barSeries.DefaultVisualStyle = style
                    chart.Series.Add(barSeries)
                Next
                chart.DataContext = ChartDataModel

[Martin Ivanov]

Hello Purna,

The chart doesn't have a built-in legend in it. In order to display such you will need to use RadLegend and bind its Items collection to the LegendItems property of the chart. You can see how to do this in the RadLegend Support article.

To display a tooltip you can use the tooltip behavior of the chart. And modify its appearance using the TooltipTemplate property. By default the tooltip displayes the X and Y values of the data point. To modify what is displayed use the template property and the DataPoint object which comes as a data context in the template. In your case you can use the Value property of the CategoricalDataPoint (derived from DataPoint). Here is an example in code:

<DataTemplate x:Key="tooltipTemplate">
    <!--Here Value is the value on the LinearAxis-->
    <TextBlock Text="{Binding Value}" />
    <!--You can also use the DataItem property to get a value from the data point business model-->
    <!--<TextBlock Text="{Binding DataItem.MyTooltipValue}" />-->
</DataTemplate>

About the color that is not applied, this happens because of the set Palette of the chart. The palette has a bigger priority than the Fill property of the DefaultVisualStyle. To apply the style you can remove the Palette setting.

I hope this helps.

Regards,
Martin Ivanov
Progress Telerik