Hi,
I have three ranges with brush color green, yellow and red.
Now, I want to fill range color only up to value [needle pointer]
for ex. ranges with min= 0 to max =130 , where as my value is 2.5 till that value only , it should be fill with green color rest should in gray like as below
But from below code , it will color all range with define color [grren yellow, red], whereas I want it should color only value 2.5 with green color remaining range should be with gray color.
$('#' + igniteGraphModel.graphDivId).igLinearGauge({
height: "80px",
width: "100%",
minimumValue: 0,
maximumValue: 130,
value:2.5,
minorTickEndExtent: 0,
minorTickStartExtent: 0,
labelExtent: -0.5,
tickBrush: "white",
tickStrokeThickness: 5.0,
ranges: [
{
brush:"green" ,
name: 'low',
startValue: 0,
endValue: 80,
},
brush:"yellow",
name: 'medium',
startValue: 80,
endValue: 100
brush: "red",
name: 'high',
startValue: 100,
endValue: 130
}
]
});
Hello,
Thank you for contacting Infragistics!
I have looked into the behavior you described and it is the expected behavior. To achieve the behavior you have you will want to remove and add ranges on the fly to match the value you have so that it only displays the color for the ranges less than your value. To do this you can use the removeRange and addRange methods:
http://help.infragistics.com/jQuery/2014.2/ui.iglineargauge#methods:removeRange
http://help.infragistics.com/jQuery/2014.2/ui.iglineargauge#methods:addRange
Please let me know if you have any further questions concerning this matter.