Title for lines in RadCartesianChart

[Yuriy]

Hello Telerik Team,

I am trying to use RadCartesianChart with few lines. I displayed the lines on RadCartesianChart and added RadLegend to display line names. But the color is the same for each lines.

So my question is How can I add unique color for every line? Or How can I add title for every line (like attached NamedLines.jpg) with some set of colors (can be repeated)?

Thank you,
Iurii.

[Milena]

Hi Iurii,

You can easily add unique color to each series by using Palette property of chartview or you can even create a custom palettes. 

As for the Legend - you can add different titles for each series in the SeriesLegendSettings. More about how to implement the legend in the chartview you can find in our help topic RadLegend Support. 

I hope this information is helpful. 

Regards,
Milena
Telerik

 

 

[Yuriy]

Hi Milena,

I tried to use custom palettes but lines disappeared from RadCartesianChart.

<Window x:Class="RadCartesianChartWithNamedMultipleLines.MainWindow"<br>        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"<br>        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"<br>        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"<br>        Title="MainWindow" Height="550" Width="925"><br>    <Window.Resources><br>        <telerik:ChartPalette x:Key="customPalette"><br>            <telerik:ChartPalette.SeriesEntries><br><br>                <telerik:PaletteEntryCollection SeriesFamily="Pie"><br>                    <telerik:PaletteEntry Fill="#FF1FAFD3" Stroke="White"/><br>                    <telerik:PaletteEntry Fill="#FFC32E0A" Stroke="White"/><br>                    <telerik:PaletteEntry Fill="#FFFA6F5E" Stroke="White"/><br>                </telerik:PaletteEntryCollection><br>                <telerik:PaletteEntryCollection SeriesFamily="Bar"><br>                    <telerik:PaletteEntry Fill="#FF006968" Stroke="White"/><br>                    <telerik:PaletteEntry Fill="#FF7A6CC4" Stroke="White"/><br>                    <telerik:PaletteEntry Fill="#FF1FAFD3" Stroke="White"/><br>                </telerik:PaletteEntryCollection><br>            </telerik:ChartPalette.SeriesEntries><br><br>            <telerik:ChartPalette.GlobalEntries><br>                <telerik:PaletteEntry Fill="#FF21B573" Stroke="White" /><br>                <telerik:PaletteEntry Fill="#FF88CA2A" Stroke="White" /><br>                <telerik:PaletteEntry Fill="#FFFF921E" Stroke="White" /><br>            </telerik:ChartPalette.GlobalEntries><br><br>        </telerik:ChartPalette><br>    </Window.Resources><br>    <Grid ><br>        <Grid.ColumnDefinitions><br>            <ColumnDefinition Width="*" /><br>            <ColumnDefinition Width="5" /><br>            <ColumnDefinition Width="Auto" /><br>        </Grid.ColumnDefinitions><br><br>        <telerik:RadCartesianChart x:Name="RadCartesianChart" Palette="{StaticResource customPalette}" HorizontalAlignment="Stretch"><br>            <telerik:RadCartesianChart.HorizontalAxis><br>                <telerik:DateTimeContinuousAxis LabelFitMode="MultiLine" Title="Time/Date"<br>                                                            LabelFormat="dd/MM/yyyy" /><br>            </telerik:RadCartesianChart.HorizontalAxis><br><br>            <telerik:RadCartesianChart.VerticalAxis><br>                <telerik:LinearAxis HorizontalAlignment="Right" Title="Price" /><br>            </telerik:RadCartesianChart.VerticalAxis><br><br>            <telerik:RadCartesianChart.SeriesProvider><br>                <telerik:ChartSeriesProvider Source="{Binding Path=Products}"><br>                    <telerik:ChartSeriesProvider.SeriesDescriptors><br><br>                        <telerik:CategoricalSeriesDescriptor ItemsSourcePath="Prices"<br>                                                                         ValuePath="Value"<br>                                                                         CategoryPath="DateTime"><br>                            <telerik:CategoricalSeriesDescriptor.Style><br>                                <Style TargetType="{x:Type telerik:SplineSeries}"><br>                                    <Setter Property="ShowLabels" Value="False" /><br>                                    <Setter Property="LegendSettings"><br>                                        <Setter.Value><br>                                            <telerik:SeriesLegendSettings Title="{Binding Path=Name}" /><br>                                        </Setter.Value><br>                                    </Setter><br>                                </Style><br>                            </telerik:CategoricalSeriesDescriptor.Style><br>                        </telerik:CategoricalSeriesDescriptor><br>                    </telerik:ChartSeriesProvider.SeriesDescriptors><br>                </telerik:ChartSeriesProvider><br>            </telerik:RadCartesianChart.SeriesProvider><br>        </telerik:RadCartesianChart><br><br>        <ScrollViewer Grid.Column="2" HorizontalScrollBarVisibility="Auto"<br>                                  VerticalScrollBarVisibility="Auto" Width="200"><br>            <telerik:RadLegend Items="{Binding ElementName=RadCartesianChart, Path=LegendItems}" /><br>        </ScrollViewer><br>    </Grid><br></Window>

What is wrong?

Thank you,
Iurii.

[Milena]

Hi Iurii,

The LineSeries are actually Path, so you should set their Stroke property. In the custom palette you sent the Stoke is White and that is the reason you can not see the series. So you can change it to:

<telerik:ChartPalette x:Key="customPalette">
            <telerik:ChartPalette.SeriesEntries>
                <telerik:PaletteEntryCollection SeriesFamily="Line">
                    <telerik:PaletteEntry Stroke="Red"/>
                    <telerik:PaletteEntry Stroke="Yellow"/>
                    <telerik:PaletteEntry Stroke="Green"/>
                </telerik:PaletteEntryCollection>
            </telerik:ChartPalette.SeriesEntries>
...

Please let us know in case any further assistance is needed.

Regards,
Milena
Telerik