Search code examples
teleriknativescriptnativescript-telerik-ui

Is there a way the to change RadChart legend text color?


I am trying to style my app with a dark theme and the legend items are black. Is there a way to change the color of the legend items? There is a property to change the title color but that doesn't effect the other series names.

example picture

<RadPieChart allowAnimation="true" height=100% row="1" col="0" colSpan="12">
               <DonutSeries tkPieSeries
                   selectionMode="DataPoint"
                   expandRadius="0.4"
                   outerRadiusFactor="0.7"
                   innerRadiusFactor="0.4"
                   valueProperty="Amount"
                   legendLabel="Country"
                   [items]="Countries" class="white"></DonutSeries>
               <Palette tkPiePalette >
                       <PaletteEntry tkPiePaletteEntry fillColor="#EB5E55" strokeColor="#EB5E55"></PaletteEntry>
                       <PaletteEntry tkPiePaletteEntry fillColor="#D81E5B" strokeColor="#D81E5B"></PaletteEntry>
                       <PaletteEntry tkPiePaletteEntry fillColor="#FDF0D5" strokeColor="#FDF0D5"></PaletteEntry>
                       <PaletteEntry tkPiePaletteEntry fillColor="#C6D8D3" strokeColor="#C6D8D3"></PaletteEntry>
                       <PaletteEntry tkPiePaletteEntry fillColor="#00FDDC" strokeColor="#00FDDC"></PaletteEntry>
                       <PaletteEntry tkPiePaletteEntry fillColor="#495F41" strokeColor="#495F41"></PaletteEntry>
                   </Palette>
             <Palette tkPiePalette seriesState="Selected">
                   <PaletteEntry tkPiePaletteEntry fillColor="#EB5E55" strokeColor="#EB5E55"></PaletteEntry>
                   <PaletteEntry tkPiePaletteEntry fillColor="#D81E5B" strokeColor="#D81E5B"></PaletteEntry>
                   <PaletteEntry tkPiePaletteEntry fillColor="#FDF0D5" strokeColor="#FDF0D5"></PaletteEntry>
                   <PaletteEntry tkPiePaletteEntry fillColor="#C6D8D3" strokeColor="#C6D8D3"></PaletteEntry>
                   <PaletteEntry tkPiePaletteEntry fillColor="#00FDDC" strokeColor="#00FDDC"></PaletteEntry>
                   <PaletteEntry tkPiePaletteEntry fillColor="#495F41" strokeColor="#495F41"></PaletteEntry>
            </Palette>
               <RadLegendView tkPieLegend position="Right" title="Country" offsetOrigin="TopRight" width="110" enableSelection="true" titleColor="white"></RadLegendView>
       </RadPieChart>

Solution

  • I don't think it's supported as of today, there is an open feature request in Github you might want to follow.

    As a workaround you may turn off default legend view and render your own list of legends using Labels.