How do I change the line color in a chart?


#1

Playground here: https://play.nativescript.org/?template=play-ng&id=3Pj4ST

I’m trying to make the line black by following the instructions here: http://docs.telerik.com/devtools/nativescript-ui/Controls/NativeScript/Chart/Series/styling

But it isn’t working. What am I missing?


#2

strokeColor isn’t working ? Also you have a Palette entry for both states of you chart, which means two strokeColor


#3

No, it isn’t working. The line is blue, which is some sort of default. I’m trying to make it black.

What do you mean about states of the chart? What are the two states?


#4

It seems on your playground that you forgot to add the palette’s directives tkCartesianPalette and tkCartesianPaletteEntry.

Here is what a RadCartesianChart looks like (it’s angular but doesn’t matter here) :

<RadCartesianChart>
<CategoricalAxis></CategoricalAxis>
<LinearAxis></LinearAxis>
<BarSeries></BarSeries>
<Palette tkCartesianPalette seriesState="Normal">
<PaletteEntry tkCartesianPaletteEntry strokeColor="#1c1c1c"></PaletteEntry>
</Palette>
<Palette tkCartesianPalette seriesState="Selected">
<PaletteEntry tkCartesianPaletteEntry strokeColor="#1c1c1c"></PaletteEntry>
</Palette>
</RadCartesianChart>

seriesState allows you to style charts data differently when it is selected or not. So if you don’t specify it, the line when selected will be the blue default one. But if you have always the default strokeColor, make sure your chart and palettes are written correctly.


#5

Thank you, that worked. My mistake was in referencing the non-Angular version of the Palettes page, which doesn’t use tkCartesianPalette or tkCartesianPaletteEntry.