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 : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Setting Range Visual Properties using CSS

Thread ID:

Created:

Updated:

Platform:

Replies:

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

Hello,

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. 

[JS] 

$("#CoreLinearGauge").ejLinearGauge({ 
scales: [{ 
//... 
    ranges: [{ 
                  backgroundColor: "red", 
                  border: { color: "black", width:2 } 
                },{ 
                   backgroundColor: "cyan", 
                   border: { color: "green", width:2  } 
                }] 
            }] 
   }); 

Screenshot: 
 
Sample for reference can be find from the below link. 

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

Thanks, 
Dharani. 


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

Hello Dharani,

Thanks for your reply.

Randy

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. 
 
Thanks, 
Dharani. 


CONFIRMATION

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.

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

;