Methods and Events

22 Feb 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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
    
    <script type="text/javascript">
        $("#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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
     
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <script>
        $("#CoreCircularGauge").ejCircularGauge();
        var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
        circulargaugeObj.getPointerCapRadius(0);
    </script>

    Getting Pointer Length

    The getPointerLength method is used to get pointer length.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <script>
        $("#CoreCircularGauge").ejCircularGauge();
        var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
        circulargaugeObj.getScaleDirection(0);
    </script>

    Getting Scale Radius

    The getScaleRadius method is used to get scale radius.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <script>
        $("#CoreCircularGauge").ejCircularGauge();
        var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
        circulargaugeObj.getScaleRadius(0);
    </script>

    Getting Start Angle

    The getStartAngle method is used to get start angle.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <script>
        $("#CoreCircularGauge").ejCircularGauge();
        var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
        circulargaugeObj.getSweepAngle(0);
    </script>

    Getting Tick Angle

    The getTickAngle method is used to get tick angle.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <script>
        $("#CoreCircularGauge").ejCircularGauge();
        var circulargaugeObj = $("#CoreCircularGauge").data("ejCircularGauge");
        circulargaugeObj.getTickWidth(0, 0);
    </script>

    Setting IncludeFirstValue

    The includeFirstValue method is used to set includeFirstValue.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
     
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • JS
  • @(Html.EJ().CircularGauge("CoreCircularGauge"))
      
    <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.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //draw custom label event
                .DrawCustomLabel("onDrawCustomLabel")
                //...
            )
    
        function onDrawCustomLabel(sender) { 
            // do something
        }

    Draw Indicators

    The DrawIndicators event is triggered while indicators are being drawn on the gauge.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
               //draw indicators event
                .DrawIndicators("onDrawIndicators")
                //...
            )
    
        function onDrawIndicators(sender) { 
            // do something
        }

    Draw Labels

    The DrawLabels event is triggered while labels are being drawn on the gauge.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //draw labels event
                .DrawLabels("onDrawLabels")
                //...
            )
    
        function onDrawLabels(sender) { 
            // do something
        }

    Draw Pointer Cap

    The DrawPointerCap event is triggered while pointer cap is being drawn on the gauge.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //draw pointer cap event
                .DrawPointerCap("onDrawPointerCap")
                //...
            )
    
        function onDrawPointerCap(sender) { 
            // do something
        }

    Draw Pointers

    The DrawPointers event is triggered while pointer cap is being drawn on the gauge.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //draw pointers event
                .DrawPointers("onDrawPointers")
                //...
            )
    
        function onDrawPointers(sender) { 
            // do something
        }

    Draw Range

    The DrawRange event is triggered when ranges starts to be drawn on the gauge.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //draw range event
                .DrawRange("onDrawRange")
                //...
            )
    
        function onDrawRange(sender) { 
            // do something
        }

    Draw Ticks

    The DrawTicks event is triggered when ticks are being drawn on the gauge.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //draw ticks event
                .DrawTicks("onDrawTicks")
                //...
            )
    
        function onDrawTicks(sender) { 
            // do something
        }

    Load

    The Load event is triggered when gauge starts to load.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //load event
                .Load("onLoad")
                //...
            )
    
        function onLoad(sender) { 
            // do something
        }

    Mouse Click

    The MouseClick event is triggered when left mouse button is clicked.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //mouse click event
                .MouseClick("onMouseClick")
                //...
            )
    
        function onMouseClick(sender) { 
            // do something
        }

    Mouse Click Move

    The MouseClickMove event is triggered when clicking and dragging the mouse pointer over the gauge pointer.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //mouse click move event
                .MouseClickMove("onMouseClickMove")
                //...
            )
    
        function onMouseClickMove(sender) { 
            // do something
        }

    Mouse Click Up

    The MouseClickUp event is triggered when clicking and dragging the mouse pointer over the gauge pointer.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //mouse click up event
                .MouseClickUp("onMouseClickUp")
                //...
            )
    
        function onMouseClickUp(sender) { 
            // do something
        }

    Render Complete

    The RenderComplete event is triggered when rendering of the gauge is completed.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //render complete event
                .RenderComplete("onRenderComplete")
                //...
            )
    
        function onRenderComplete(sender) { 
            // do something
        }

    Range Mouse Move

    The RangeMouseMove event is triggered when moving mouse on ranges.

  • CSHTML
  • @(Html.EJ().CircularGauge("circulargauge1")
               
                //range mouse move event
                .RangeMouseMove("onRangeMouseMove")
                //...
            )
    
        function onRangeMouseMove(sender) { 
            // do something
        }

    DoubleClick

    The DoubleClick event is triggered when double clicking the gauges.

  • CSHTML
  • @(Html.EJ().CircularGauge("gauge")
               
                //double click event
                .DoubleClick("onDoubleClick")
                //...
            )
    
        function onDoubleClick(sender) { 
            // do something
        }

    RightClick

    The RightClick event is triggered when right clicking the gauges.

  • CSHTML
  • @(Html.EJ().CircularGauge("gauge")
               
                //right click event
                .RightClick("onRightClick")
                //...
            )
    
        function onRightClick(sender) { 
            // do something
        }