JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://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>
<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>

<div id="radialgauge"></div>

    <div>
        <fieldset id="gaugeOptions">
            <legend>Options</legend>
            <strong>Radial Gauge Options</strong>
				<br />
				<div class="optionContainer">
					Needle Value
					<br />
					<div id="needleValueSlider" class="sliderBounds"></div>
					<label id="needleValueLabel">60</label>
				</div>
				<div class="optionContainer">
               Start Extent
					<br />
               <div id="startExtentSlider" class="sliderBounds"></div>
               <label id="startExtentLabel">0</label>
				</div>
				<div class="optionContainer">
              End Extent
				  <br />
              <div id="endExtentSlider" class="sliderBounds"></div>
              <label id="endExtentLabel">0.48</label>
				</div>
				<div class="optionContainer">
              Start Width Ratio
					<br />
              <div id="startWidthRatioSlider" class="sliderBounds"></div>
              <label id="startWidthRatioLabel">0</label>
				</div>
				<div class="optionContainer">
               End Width Ratio
					<br />
               <div id="endWidthRatioSlider" class="sliderBounds"></div>
               <label id="endWidthRatioLabel">0</label>
				</div>
				<br />
            <strong>Needle Shapes</strong>
				<br />
				<div class="optionContainer">
               Needle Shape
					<br />
 ...

CSS

.sliderBounds {
    	   width: 95px;
    	   margin: 6px 3px 6px 6px;
			display: inline-block;
    	}
    	.optionContainer {
    	   width: 145px;
    	   margin: 2px;
			padding: 2px;
			display: inline-block;
			border: 1px solid #e0e0e0;
			-moz-border-radius: 4px;
			-webkit-border-radius: 4px;
			border-radius: 4px;
    	}
    	.selectBounds {
    	   min-width: 120px;
    	   max-width: 132px;
    	}

JavaScript

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


            // Needle Value
            $("#needleValueSlider").slider({
                min: 0,
                max: 100,
                value: 60,
                slide: function (event, ui) {
                    $("#radialgauge").igRadialGauge("option", "value", ui.value);
                    $("#needleValueLabel").text(ui.value);
                }
            });

            // Start Extent
            $("#startExtentSlider").slider({
                min: 0,
                max: 1,
                step: 0.01,
                value: 0,
                slide: function (event, ui) {
                    $("#radialgauge").igRadialGauge("option", "needleStartExtent", ui.value);
                    $("#startExtentLabel").text(ui.value);
                }
            });

            // End Extent
            $("#endExtentSlider").slider({
                min: 0,
                max: 1,
                step: 0.01,
                value: 0.48,
                slide: function (event, ui) {
                    $("#radialgauge").igRadialGauge("option", "needleEndExtent", ui.value);
                    $("#endExtentLabel").text(ui.value);
                }
            });

            // Start Width Ratio
            $("#startWidthRatioSlider").slider({
                min: 0,
                max: 1,
                step: 0.01,
                value: 0,
                slide: function (event, ui) {
                    $("#radialgauge").igRadialGauge("option", "needleStartWidthRatio", ui.value);
                    $("#startWidthRatioLabel").text(ui.value);
                }
            });

            // End Width Ratio
            $("#endWidthRatioSlider").slider({
                min: 0,
                max: 1,
                step: 0.01,
               ...