JSFiddle - React, Tailwind, and code Playground

by igalst

HTML

<script src="http://cdn3.devexpress.com/jslib/13.1.5/js/dx.chartjs.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/globalize/0.1.1/globalize.min.js"></script>
 <div id="gaugeContainer" style="height:320px"></div>

JavaScript

$("#gaugeContainer").dxCircularGauge({
    scale: {
        startValue: 0,
        endValue: 25,
         majorTick: {
            color: 'black',
            tickInterval: 5
        }
    },
    value: 15,
    subvalues: [15],
    rangeContainer: {
        offset: -40,
        ranges: [
                {
                    startValue: 0,
                    endValue: 5,
                    color: '#2e8bb9'
                },
                {
                    startValue: 5,
                    endValue: 10,
                    color: '#66cc33'
                }
        ]
    }
});