- Public Methods
- Destroying the Circular Gauge
- Getting Back Needle Length
- Getting Custom Label Angle
- Getting Custom Label value
- Getting Label Angle
- Getting Label Distance From Scale
- Getting Label Placement
- Getting Label Style
- Getting Major Interval Value
- Getting Maker Distance From Scale
- Getting Maker Style
- Getting Maximum Value
- Getting Minimum Value
- Getting Minor Interval Value
- Getting Needle Style
- Getting Pointer Cap Border Width
- Getting Pointer Cap Radius
- Getting Pointer Length
- Getting Pointer Needle Type
- Getting Pointer Placement
- Getting Pointer Value
- Getting Pointer Value
- Getting Range Border Width
- Getting Range Distance From Scale
- Getting Range End Value
- Getting Range Position
- Getting Range Size
- Getting Range Start Value
- Getting Scale Bar Size
- Getting Scale Border Width
- Getting Scale Direction
- Getting Scale Radius
- Getting Start Angle
- Getting Sub Gauge Location
- Getting Sweep Angle
- Getting Tick Angle
- Getting Tick Distance From Scale
- Getting Tick Height
- Getting Tick Placement
- Getting Tick Style
- Getting Tick Width
- Setting IncludeFirstValue
- Redrawing Circular Gauge
- Setting Back Needle Length
- Setting Custom Label Angle
- Setting Custom Label value
- Setting Label Angle
- Setting Label Distance From Scale
- Setting Label Placement
- Setting Label Style
- Setting Major Interval Value
- Setting Maker Distance From Scale
- Setting Maker Style
- Setting Maximum Value
- Setting Minimum Value
- Setting Minor Interval Value
- Setting Needle Style
- Setting Pointer Cap Border Width
- Setting Pointer Cap Radius
- Setting Pointer Length
- Setting Pointer Needle Type
- Setting Pointer Placement
- Setting Pointer Value
- Setting Pointer Value
- Setting Range Border Width
- Setting Range Distance From Scale
- Setting Range End Value
- Setting Range Position
- Setting Range Size
- Setting Range Start Value
- Setting Scale Bar Size
- Setting Scale Border Width
- Setting Scale Direction
- Setting Scale Radius
- Setting Start Angle
- Setting Sub Gauge Location
- Setting Sweep Angle
- Setting Tick Angle
- Setting Tick Distance From Scale
- Setting Tick Height
- Setting Tick Placement
- Setting Tick Style
- Setting Tick Width
- Events
Contact Support
Methods and Events
19 Jan 201824 minutes to read
Public Methods
Destroying the Circular Gauge
The destroy
method is used to destroy the CircularGauge widget. All events bound using this._on will be unbind automatically and bring the control to pre-init state.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.destroy();
</script>
Getting Back Needle Length
The getBackNeedleLength
method is used to get the needle length of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({ scales: [{ pointers: [{ showBackNeedle: true }] }] });
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getBackNeedleLength(0, 0);
</script>
Getting Custom Label Angle
The getCustomLabelAngle
method is used to get the angle of custom label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{customLabels:[{textAngle:30,value:"MyLabel",position:{x:250,y:300},color:"#fc0606",font:{size: "20px", fontFamily: "Arial", fontStyle: "Bold" }}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getCustomLabelAngle(0, 0);
</script>
Getting Custom Label value
The getCustomLabelValue
method is used to get the value of custom label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{customLabels:[{textAngle:30,value:"MyLabel",position:{x:250,y:300},color:"#fc0606",font:{size: "20px", fontFamily: "Arial", fontStyle: "Bold" }}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getCustomLabelValue(0, 0);
</script>
Getting Label Angle
The getLabelAngle
method is used to get angle of label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getLabelAngle(0, 0);
</script>
Getting Label Distance From Scale
The getLabelDistanceFromScale
method is used to get the distance value from scale for label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getLabelDistanceFromScale(0, 0);
</script>
Getting Label Placement
The getLabelPlacement
method is used to get placement of label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getLabelPlacement(0, 0);
</script>
Getting Label Style
The getLabelStyle
method is used to get style of label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getLabelStyle(0, 0);
</script>
Getting Major Interval Value
The getMajorIntervalValue
method is used to get major interval value of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getMajorIntervalValue(0);
</script>
Getting Maker Distance From Scale
The getMarkerDistanceFromScale
method is used to get distance from scale value of marker.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getMarkerDistanceFromScale(0);
</script>
Getting Maker Style
The getMarkerStyle
method is used to get distance from scale value of marker.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getMarkerStyle(0, 0);
</script>
Getting Maximum Value
The getMaximumValue
method is used to get maximum value of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getMaximumValue(0);
</script>
Getting Minimum Value
The getMinimumValue
method is used to get minimum value of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getMinimumValue(0);
</script>
Getting Minor Interval Value
The getMinorIntervalValue
method is used to get minor interval value of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getMinorIntervalValue(0);
</script>
Getting Needle Style
The getNeedleStyle
method is used to get style of needle.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getNeedleStyle(0, 0);
</script>
Getting Pointer Cap Border Width
The getPointerCapBorderWidth
method is used to get border width of pointer cap.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getPointerCapBorderWidth(0);
</script>
Getting Pointer Cap Radius
The getPointerCapRadius
method is used to get radius of pointer cap.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getPointerCapRadius(0);
</script>
Getting Pointer Length
The getPointerLength
method is used to get pointer length.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getPointerLength(0, 0);
</script>
Getting Pointer Needle Type
The getPointerNeedleType
method is used to get needle type of pointer.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getPointerNeedleType(0, 0);
</script>
Getting Pointer Placement
The getPointerPlacement
method is used to get placement of pointer.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getPointerPlacement(0, 0);
</script>
Getting Pointer Value
The getPointerValue
method is used to get pointer value.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getPointerValue(0, 0);
</script>
Getting Pointer Value
The getPointerWidth
method is used to get pointer width.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getPointerWidth(0, 0);
</script>
Getting Range Border Width
The getRangeBorderWidth
method is used to get border width of range.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getRangeBorderWidth(0, 0);
</script>
Getting Range Distance From Scale
The getRangeDistanceFromScale
method is used to get range distance from scale.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getRangeDistanceFromScale(0, 0);
</script>
Getting Range End Value
The getRangeEndValue
method is used to get end value of range.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getRangeEndValue(0, 0);
</script>
Getting Range Position
The getRangePosition
method is used to get range position.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getRangePosition(0, 0);
</script>
Getting Range Size
The getRangeSize
method is used to get range size.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getRangeSize(0, 0);
</script>
Getting Range Start Value
The getRangeStartValue
method is used to get range start value.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getRangeStartValue(0, 0);
</script>
Getting Scale Bar Size
The getScaleBarSize
method is used to get scale bar size.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getScaleBarSize(0);
</script>
Getting Scale Border Width
The getScaleBorderWidth
method is used to get border width of scale.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({ scales: [{showScaleBar: true, size: 6, border:{Width: 1.5} }] });
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getScaleBorderWidth(0);
</script>
Getting Scale Direction
The getScaleDirection
method is used to get scale direction.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getScaleDirection(0);
</script>
Getting Scale Radius
The getScaleRadius
method is used to get scale radius.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getScaleRadius(0);
</script>
Getting Start Angle
The getStartAngle
method is used to get start angle.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getStartAngle(0);
</script>
Getting Sub Gauge Location
The getSubGaugeLocation
method is used to get location of subGauge.
<div id="CoreCircularGauge"></div>
<div id="subGauge1"></div>
<script>
$("#subGauge1").ejCircularGauge({backgroundColor: "#f5b43f",scales: [{radius: 150}]});
$("#CoreCircularGauge").ejCircularGauge({height: 500,width: 500,scales: [{radius: 250,subGauges: [{controlID: "subGauge1",height: 400,width: 200,position: { x: 200, y: 150 }}]}]});
circulargaugeObj.getSubGaugeLocation(0, 0);
</script>
Getting Sweep Angle
The getSweepAngle
method is used to get sweep angle.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getSweepAngle(0);
</script>
Getting Tick Angle
The getTickAngle
method is used to get tick angle.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getTickAngle(0, 0);
</script>
Getting Tick Distance From Scale
The getTickDistanceFromScale
method is used to get tick distance from scale value.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getTickDistanceFromScale(0, 0);
</script>
Getting Tick Height
The getTickHeight
method is used to get tick height.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getTickHeight(0, 0);
</script>
Getting Tick Placement
The getTickPlacement
method is used to get tick placement.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getTickPlacement(0, 0);
</script>
Getting Tick Style
The getTickStyle
method is used to get tick style.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getTickStyle(0, 0);
</script>
Getting Tick Width
The getTickWidth
method is used to get tick width.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.getTickWidth(0, 0);
</script>
Setting IncludeFirstValue
The includeFirstValue
method is used to set includeFirstValue.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.includeFirstValue(0, 0, false);
</script>
Redrawing Circular Gauge
The redraw
method is used to redraw the Circular Gauge widget.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.redraw("scale");
</script>
Setting Back Needle Length
The setBackNeedleLength
method is used to set the needle length of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({ scales: [{ pointers: [{ showBackNeedle: true }] }] });
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setBackNeedleLength(0, 0, 10);
</script>
Setting Custom Label Angle
The setCustomLabelAngle
method is used to set the angle of custom label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{customLabels:[{value:"MyLabel",position:{x:250,y:300},color:"#fc0606",font: { size: "20px", fontFamily: "Arial", fontStyle: "Bold" }}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setCustomLabelAngle(0, 0, 10);
</script>
Setting Custom Label value
The setCustomLabelValue
method is used to set the value of custom label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{customLabels:[{value:"MyLabel",position:{x:180,y:300},color:"#fc0606",font:{size: "20px", fontFamily: "Arial", fontStyle: "Bold" }}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setCustomLabelValue(0, 0, "CircularGauge");
</script>
Setting Label Angle
The setLabelAngle
method is used to set angle of label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setLabelAngle(0, 0, 10);
</script>
Setting Label Distance From Scale
The setLabelDistanceFromScale
method is used to set the distance value from scale for label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setLabelDistanceFromScale(0, 0, 10);
</script>
Setting Label Placement
The setLabelPlacement
method is used to set placement of label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setLabelPlacement(0, 0, 'far');
</script>
Setting Label Style
The setLabelStyle
method is used to set style of label.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setLabelStyle(0, 0, 'major');
</script>
Setting Major Interval Value
The setMajorIntervalValue
method is used to set major interval value of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setMajorIntervalValue(0, 10);
</script>
Setting Maker Distance From Scale
The setMarkerDistanceFromScale
method is used to set distance from scale value of marker.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setMarkerDistanceFromScale(0, 10);
</script>
Setting Maker Style
The setMarkerStyle
method is used to set distance from scale value of marker.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setMarkerStyle(0, 0, 'rectangle');
</script>
Setting Maximum Value
The setMaximumValue
method is used to set maximum value of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setMaximumValue(0, 130);
</script>
Setting Minimum Value
The setMinimumValue
method is used to set minimum value of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setMinimumValue(0, 10);
</script>
Setting Minor Interval Value
The setMinorIntervalValue
method is used to set minor interval value of CircularGauge.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setMinorIntervalValue(0, 2);
</script>
Setting Needle Style
The setNeedleStyle
method is used to set style of needle.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setNeedleStyle(0, 0, 'arrow');
</script>
Setting Pointer Cap Border Width
The setPointerCapBorderWidth
method is used to set border width of pointer cap.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setPointerCapBorderWidth(0, 5);
</script>
Setting Pointer Cap Radius
The setPointerCapRadius
method is used to set radius of pointer cap.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setPointerCapRadius(0, 10);
</script>
Setting Pointer Length
The setPointerLength
method is used to set pointer length.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setPointerLength(0, 0, 90);
</script>
Setting Pointer Needle Type
The setPointerNeedleType
method is used to set needle type of pointer.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setPointerNeedleType(0, 0, 'triangle');
</script>
Setting Pointer Placement
The setPointerPlacement
method is used to set placement of pointer.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setPointerPlacement(0, 0,'near');
</script>
Setting Pointer Value
The setPointerValue
method is used to set pointer value.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setPointerValue(0, 0, 10);
</script>
Setting Pointer Value
The setPointerWidth
method is used to set pointer width.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setPointerWidth(0, 0, 10);
</script>
Setting Range Border Width
The setRangeBorderWidth
method is used to set border width of range.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setRangeBorderWidth(0, 0, 5);
</script>
Setting Range Distance From Scale
The setRangeDistanceFromScale
method is used to set range distance from scale.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setRangeDistanceFromScale(0, 0, 10);
</script>
Setting Range End Value
The setRangeEndValue
method is used to set end value of range.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setRangeEndValue(0, 0, 70);
</script>
Setting Range Position
The setRangePosition
method is used to set range position.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setRangePosition(0, 0, 'far');
</script>
Setting Range Size
The setRangeSize
method is used to set range size.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setRangeSize(0, 0, 10);
</script>
Setting Range Start Value
The setRangeStartValue
method is used to set range start value.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({scales: [{showRanges: true,ranges: [{distanceFromScale: -30,startValue: 0,endValue: 70}]}]});
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setRangeStartValue(0, 0, 10);
</script>
Setting Scale Bar Size
The setScaleBarSize
method is used to set scale bar size.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setScaleBarSize(0, 160);
</script>
Setting Scale Border Width
The setScaleBorderWidth
method is used to set border width of scale.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge({ scales: [{showScaleBar: true, size: 6, border:{Width: 1.5} }] });
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setScaleBorderWidth(0, 3);
</script>
Setting Scale Direction
The setScaleDirection
method is used to set scale direction.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setScaleDirection(0, 'clockwise');
</script>
Setting Scale Radius
The setScaleRadius
method is used to set scale radius.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setScaleRadius(0, 140);
</script>
Setting Start Angle
The setStartAngle
method is used to set start angle.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setStartAngle(0, 10);
</script>
Setting Sub Gauge Location
The setSubGaugeLocation
method is used to set location of subGauge.
<div id="CoreCircularGauge"></div>
<div id="subGauge1"></div>
<script>
$("#subGauge1").ejCircularGauge({backgroundColor: "#f5b43f",scales: [{radius: 150}]});
$("#CoreCircularGauge").ejCircularGauge({height: 500,width: 500,scales: [{radius: 250,subGauges: [{controlID: "subGauge1",height: 400,width: 200,position: { x: 200, y: 150 }}]}]});
circulargaugeObj.setSubGaugeLocation(0, 0, {x:50,y:100});
</script>
Setting Sweep Angle
The setSweepAngle
method is used to set sweep angle.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setSweepAngle(0, 220);
</script>
Setting Tick Angle
The setTickAngle
method is used to set tick angle.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setTickAngle(0, 0, 10);
</script>
Setting Tick Distance From Scale
The setTickDistanceFromScale
method is used to set tick distance from scale value.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setTickDistanceFromScale(0, 0, 15);
</script>
Setting Tick Height
The setTickHeight
method is used to set tick height.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setTickHeight(0, 0, 10);
</script>
Setting Tick Placement
The setTickPlacement
method is used to set tick placement.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setTickPlacement(0, 0, 'near');
</script>
Setting Tick Style
The setTickStyle
method is used to set tick style.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setTickStyle(0, 0, 'minor');
</script>
Setting Tick Width
The setTickWidth
method is used to set tick width.
<div id="CoreCircularGauge"></div>
<script>
$("#CoreCircularGauge").ejCircularGauge();
var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
circulargaugeObj.setTickWidth(0, 0, 5);
</script>
Events
Draw Custom Label
The drawCustomLabel
event is triggered while custom labels are drawn on the gauge.
$("#CircularGauge1").ejCircularGauge({
//draw custom label event
drawCustomLabel: function(args){
},
//...
});
Draw Indicators
The drawIndicators
event is triggered while indicators are being drawn on the gauge.
$("#CircularGauge1").ejCircularGauge({
//draw indicators event
drawIndicators: function(args){
},
//...
});
Draw Labels
The drawLabels
event is triggered while labels are being drawn on the gauge.
$("#CircularGauge1").ejCircularGauge({
//draw labels event
drawLabels: function(args){
},
//...
});
Draw Pointer Cap
The drawPointerCap
event is triggered while pointer cap is being drawn on the gauge.
$("#CircularGauge1").ejCircularGauge({
//draw pointer cap event
drawPointerCap: function(args){
},
//...
});
Draw Pointers
The drawPointers
event is triggered while pointer cap is being drawn on the gauge.
$("#CircularGauge1").ejCircularGauge({
//draw pointer event
drawPointers: function(args){
},
//...
});
Draw Range
The drawRange
event is triggered when ranges starts to be drawn on the gauge.
$("#CircularGauge1").ejCircularGauge({
//draw range event
drawRange: function(args){
},
//...
});
Draw Ticks
The drawTicks
event is triggered when ticks are being drawn on the gauge.
$("#CircularGauge1").ejCircularGauge({
//draw ticks event
drawTicks: function(args){
},
//...
});
Load
The load
event is triggered when gauge starts to load.
$("#CircularGauge1").ejCircularGauge({
//load event
load: function(args){
},
//...
});
Mouse Click
The mouseClick
event is triggered when left mouse button is clicked.
$("#CircularGauge1").ejCircularGauge({
//mouse click event
mouseClick: function(args){
},
//...
});
Mouse Click Move
The mouseClickMove
event is triggered when clicking and dragging the mouse pointer over the gauge pointer.
$("#CircularGauge1").ejCircularGauge({
//mouse click move event
mouseClickMove: function(args){
},
//...
});
Mouse Click Up
The mouseClickUp
event is triggered when clicking and dragging the mouse pointer over the gauge pointer.
$("#CircularGauge1").ejCircularGauge({
//mouse click up event
mouseClickUp: function(args){
},
//...
});
Render Complete
The renderComplete
event is triggered when rendering of the gauge is completed.
$("#CircularGauge1").ejCircularGauge({
//render complete event
renderComplete: function(args){
},
//...
});
Range Mouse Move
The rangeMouseMove
event is triggered when moving mouse on ranges.
$("#CircularGauge1").ejCircularGauge({
//range mouse move event
rangeMouseMove: function(args){
},
//...
});
doubleClick
The doubleClick
event is triggered when double clicking the gauges.
//DoubleClick event for circular gauge
$("#CoreCircularGauge").ejCircularGauge({
doubleClick: function (args) {
//Do something
}
});
rightClick
The rightClick
event is triggered when right clicking the gauges.
//RightClick event for circular gauge
$("#CoreCircularGauge").ejCircularGauge({
rightClick: function (args) {
//Do something
}
});