Where do Chart series default colors come from?

1 Answer 245 Views
Charts ColorPalette
Hans
Top achievements
Rank 2
Iron
Iron
Hans asked on 24 Mar 2023, 11:13 AM

I want my end users to be able to select a "series palette" for the telerik charts I created.

Though I can easily create a handler that assigns colors to series when I create them, I was wondering where the default colors come from when no color was assigned to the series, and if I can "override" this somehow for a specific chart.

I have Examined the source code somewhat, but up to now to no avail.

1) Is it possible to set the "default colors palette" on <TelerikChart > or <ChartSeriesItems> level, but without setting a specific color on <ChartSeries> level?

2) Is there another way (eg CSS) to define the series color palette for a chart series that would not change the palette for other charts on the same page?

3) How could I address the (default color) palette if I wanted to assign eg each column in a column chart with a color from the default palette?

 

TIA - Hans

1 Answer, 1 is accepted

Sort by
1
Accepted
Ivan
Top achievements
Rank 3
Iron
Iron
Iron
answered on 27 Mar 2023, 09:18 PM
Hi!
They taken from built-in themes and can be overriden with ThemeBuilder
https://themebuilderapp.telerik.com/


Werdna
Top achievements
Rank 1
commented on 16 Aug 2023, 08:16 PM

Ivan,

I am fine using this color palette, but if I have more than 6 series, these colors just repeat.  How can I add many more colors than just the default 6?

Yanislav
Telerik team
commented on 21 Aug 2023, 08:25 AM

Hello Andrew,

To have full control over the color of the series, you can specify a ColorField

<ChartSeries Type="ChartSeriesType.Pie"
                     ColorField="@nameof(ModelData.Color)"

Thus, you can define your own colors for the series by including a field in the model whose value is a valid CSS color. The colors will be applied to the respective series. 

You can specify the color explicitly or execute a custom logic to generate random colors like in the following example: https://blazorrepl.telerik.com/wHaPmxvx35X8Zw1v52

I hope this helps. In case you have any other questions, please do not hesitate to contact us. 

Tags
Charts ColorPalette
Asked by
Hans
Top achievements
Rank 2
Iron
Iron
Answers by
Ivan
Top achievements
Rank 3
Iron
Iron
Iron
Share this question
or