JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://rawgit.com/masayuki0812/c3/master/c3.js"></script>
<link rel="stylesheet" href="https://rawgit.com/masayuki0812/c3/master/c3.css">
<div id="chart"></div>
CSS
div {
min-height: 200px;
}
JavaScript
var chart = c3.generate({
bindto: '#chart',
data: {
columns: []
}
});
var data = [["Name", "15", "30", "45"], ["x", "1", "2", "3"], ["Age", "45", "38", "25"], ["y", "1", "2", "4"]];
function update_graph(arg) {
var xs = {};
xs[arg[0][0]] = arg[1][0];
xs[arg[2][0]] = arg[3][0];
chart.load({
xs: xs,
columns: [
arg[0],
arg[1],
arg[2],
arg[3],
],
});
}
update_graph(data);