We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Changing color

Hello, I want to know how to Change the Color for the types line and rangearea? Any help would be appreciated.
Thanks, Alex 

1 Reply

SK Saravana Kumar Kanagavel Syncfusion Team February 8, 2016 12:07 PM UTC

Hi Alexander Muthler,

Thanks for contacting Syncfusion support.

You can change the color for the types of line and range area chart  through button click.

Please find the code snippet below


var button = $('<input/>', { type: "button", id: "field", value: "Change Color", onclick:"change()"});//To create button

     button.appendTo($(element)); /To append button in body

function change()


    var chart,type,i;

     chart = $("#container").ejChart("instance");

     for (i = 0; i < chart.model.series.length;i++)


         type = chart.model.series[i].type;

         if(type == 'line')

             chart.model.series[i].fill = "#99ff33"//To change the color to line chart


             chart.model.series[i].fill = "#ff6600"//To change the color to range area




On button click, We have changed the line and range area color through redrawing the chart.

We have created a sample for your reference. It can be downloaded from the below link.

Sample Link:

Please let us know if you need any other assistance.

Saravana Kumar K

Live Chat Icon For mobile
Up arrow icon