Chart: CSS Styling

[tgpetrov]

Currently to change the style of the series in the chart, one has to add PaletteEntires, to change the style of the labels, one has to use the Axis' properties, etc. Add support to control these through CSS. For example:

RadCartesianChart {
    color: red;
    background-color: blue;
}
BarSeries {
    stroke-width: 5;
    stroke-color: red;
    fill-color: blue;
}
ChartAxisLabel {
    font-size: 14;
    font-family: serif;
}

[finger563]

hopefully this would also allow us to set the font of the axis labels - which I see no way to do according to the docs (and setting fontName on the axis doesn't work either)

[tgpetrov]

@finger563 yes, you will be able to change the font of the axis labels. For the next release of nativescript-ui-chart we plan to have the following:

• Chart selectors: RadCartesianChart & RadPieChart – color, background-related properties (background, background-color, etc.), border-related properties (border-color, border-width, etc.), font-related properties (font-size, font-family, etc.), margin and padding.
• Cartesian Series selectors: LineSeries, SplineSeries, OhlcSeries, ScatterSeries, BarSeries, RangeBarSeries, AreaSeries, SplineAreaSeries, CandlestickSeries, BubbleSeries, ScatterBubbleSeries – stroke-width, stroke-color, fill-color
• Pie Series selectors: PieSeries, DonutSeries – stroke-width, stroke-colors, fill-colors
• Axes selectors: CategoricalAxis, DateTimeCategoricalAxis, LinearAxis, LogarithmicAxis, DateTimeContinuousAxis – all existing properties (like line-thickness, ticks-color, major-step, etc.)
• Axes labels selector: ChartAxisLabel - font-related properties (font-size, font-family, etc.), format, color, background-color, border-color, border-width, padding, margin
• Series labels selector: ChartSeriesLabel - font-related properties (font-size, font-family, etc.), format, color, background-color, border-color, border-width, padding, margin

[zbranzov]

The feature is released in nativescript-ui-chart@7.0.0