JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://jp.igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.dv.js"></script>
<script src="https://jp.igniteui.com/js/apiviewer.js"></script>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>
<link href="https://jp.igniteui.com/css/apiviewer.css" rel="stylesheet" type="text/css"></link>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/i18n/infragistics-ja.js"></script>

<div id="radialGauge"></div>

    <div class="api-explorer">  
        <table style="width: 100%;">
	        <tr>
                <td><span>針値の入力/設定: </span></td>
                <td style="text-align: right;">
                    <input type="text" id="needleValue" name="format" value="" class="apiInput"></input>
                    <span class="apiButton ui-corner-all" id="changeNeedleValue">針値の設定</span>
                </td>
            </tr>
            <tr style="height:10px"></tr>
            <tr>
                <td><span>現在の針値の取得: </span></td>
                <td style="text-align: right;">
                    <span class="apiButton ui-corner-all" id="getNeedleValue">針値の取得</span>
                </td>
            </tr>
        </table>
    </div>

    <div class="api-viewer"></div>

CSS

.apiButton {
          text-align: center;
          padding: 0px 0.5em 0px 0.5em;
          margin: 0.1em !important;
          display: inline-block;
          cursor: pointer;
          background: #f0f0f0;
          border: 1px solid #a0a0a0;
       }
       .apiButton:hover {
          background: #d0d0f0;
          border: 1px solid #505090;
       }
		 .apiInput {
          width: 3em;
          margin: 0.1em;
          border: 1px solid #a0a0a0;
		 }

JavaScript

$(function () {

            // Used to show output in the API Viewer at runtime, 
            // defined in external script 'apiviewer.js'    
            var apiViewer = new $.ig.apiViewer();

            /*----------------- Method & Option Examples -------------------------*/
            
            // process events of buttons
            $("#changeNeedleValue").on({
                click: function (e) {
                    var needleValue = parseFloat($("#needleValue").val());
                    if (!needleValue || isNaN(needleValue)) {
                        needleValue = 0;
                    }
                    needleValue = Math.min(Math.max(needleValue, 0), 100);
                    $("#radialGauge").igRadialGauge("option", "value", needleValue);
                    $("#needleValue").val(needleValue);
                }
            });
                  
            var prevValue = null;
            $("#getNeedleValue").on({
                click: function (e) {
                    var needleValue = $("#radialGauge").igRadialGauge("option", "value");
                    if (prevValue == null || prevValue != needleValue) {
                        apiViewer.log("現在の針値: " + needleValue);
                        prevValue = needleValue;
                    }
                }
            });
                      
            /*----------------- Instantiation -------------------------*/

            $("#radialGauge").igRadialGauge({
                height: "500px",
                transitionDuration: "1500",
                width: "100%"                
            });

            function isAndroid() {
                return navigator.userAgent.match(/Android/i) ? true : false;
            }

            $("#radialGauge").igRadialGauge("option", "value", 0);
            $("#needleValue").val(0);
        });