var gaugeData = {'data': 80.0} // create a chart and set options // note that via the c3.js API we bind the chart to the element with id equal to chart1 var chart = c3.generate({ bindto: '#chart1', data: { json: gaugeData, type: 'gauge', }, gauge: { label:{ //returning here the value and not the ratio format: function(value, ratio){ return value;} }, min: 0, max: 100, width: 15, units: 'value' //this is only the text for the label } }); // this function will update every 2000 milliseconds // and create a new value between 0 and 100 setInterval(function () { // create a random value between 0 and 100, rounded to 2 digits var newValue = Math.floor(100 * Math.random()); // create a data array holding the random value var newData = {'data': newValue }; // tell the chart to load the new data chart.load({ json: newData }); }, 2000);
<div id="chart1"></div>