JSFiddle - React, Tailwind, and code Playground

by Yuval Bar-On

HTML

<link rel="stylesheet" href="http://c3js.org/css/c3-48e8b7bd.css">
<script src="http://c3js.org/js/c3.min-7078274d.js"></script>
<div id="graph">

CSS

#graph {
    width: 600px;
    height: 400px;
    margin: 1em;
}

JavaScript

var chart = c3.generate({
    bindto: '#graph',
    data: {
        x: 'x',
        columns: [
            ['x', 12, 15, 16, 50, 58, 70, 90],
            ['data1', 30, 123, 200, 240, 289, 350, 400]
        ],
        type: 'spline',
    },
    axis: {
        y: {
            tick: {
                format: d3.format("s")
            }
        }
    },

    tooltip: {
        format: {
            title: function (d) {
                return 'test title';
            },
            value: d3.format('test test test')
        }
    }

});