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

Setting Range Visual Properties using CSS

Thread ID:





129219 Mar 5,2017 09:56 PM UTC Mar 7,2017 06:00 AM UTC JavaScript 3
Tags: ejLinearGauge
Randy Craven
Asked On March 5, 2017 09:56 PM UTC


Is it possible to set the visual properties in a Linear Gauge (such as a range background color and border) using CSS classes?

Thank you,

Randy Craven

Dharanidharan Dharmasivam [Syncfusion]
Replied On March 6, 2017 05:27 AM UTC

Hi Randy, 

Thanks for contacting Syncfusion support. 

We have analyzed your query. Since the linear gauge is rendered as HTML5 canvas element, we can’t set the CSS styles for border and background color of the ranges. But instead of that, we have provided API’s to change those and it is depicted in the below code snippet. 


scales: [{ 
    ranges: [{ 
                  backgroundColor: "red", 
                  border: { color: "black", width:2 } 
                   backgroundColor: "cyan", 
                   border: { color: "green", width:2  } 

Sample for reference can be find from the below link. 

For more information on border, background color properties of ranges, follow the below link 


Randy Craven
Replied On March 6, 2017 05:54 PM UTC

Hello Dharani,

Thanks for your reply.


Dharanidharan Dharmasivam [Syncfusion]
Replied On March 7, 2017 06:00 AM UTC

Hi Randy, 
Thanks for your update. 
Kindly revert us, if you require any further assistance. 


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