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. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Changing color

Thread ID:





121905 Feb 5,2016 09:23 PM UTC Feb 8,2016 12:07 PM UTC LightSwitch HTML 1
Tags: Chart
Alexander M
Asked On February 5, 2016 09:23 PM UTC

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

Saravana Kumar Kanagavel [Syncfusion]
Replied On 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


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon