How to set chart series color?

2 posts, 0 answers
  1. alex
    alex avatar
    15 posts
    Member since:
    Nov 2020

    Posted 19 Nov 2020 Link to this post

    How to set chart series color?

    I would like to set the color of pie chart item

     

    <kendo-chart-series-item
        type="pie"
        [data]="source"
        field="value"
        [color]="color" // it doesn't work
        categoryField="name" >

     

  2.
  3. Hetali
    Admin
    Hetali avatar
    73 posts

    Posted 22 Nov 2020 Link to this post

    Hi Alex,

    In order to set the color of the Kendo UI Pie Chart, use the colorField property as seen below:

    <kendo-chart>
  <kendo-chart-series>
    <kendo-chart-series-item type="pie" [data]="pieData" [colorField]= "'colorString'">
    </kendo-chart-series-item>
  </kendo-chart-series>
</kendo-chart>

    public pieData: any[] = [
  { category: '0-14', value: 0.2545, colorString: "yellow" },
  { category: '15-24', value: 0.1552, colorString: "red" },
  { category: '25-54', value: 0.4059, colorString: "orange" }
];

    In this StackBlitz example, each group in the Kendo UI Pie Chart has custom defined color.

    I hope this helps. Please let me know if I can further assist you.

    Regards,
    Hetali
    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Back to Top