JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.13.0/d3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.6.1/c3.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.6.1/c3.min.css">
<div id="chart"></div>

JavaScript

var chart = c3.generate({
        data: {
            y: 'x',
            xFormat: '%Y-%m-%d %H:%M:%S',
            columns: [
                ['x', '2013-01-01 12:00:00', '2013-01-02 12:00:05', '2013-01-03 12:00:10', '2013-01-04 12:00:15', '2013-01-05 12:00:20', '2013-01-10 12:00:25', '2013-01-15 12:00:30', '2013-02-15 12:00:35'],
                ['data1', 30, 200, 100, 400, 150, 250, 400, 200],
                ['data2', 830, 1200, 1100, 1400, 1150, 1250, 1500, 300],
            ],
            axes: {
                data2: 'x2'
            },

        },

        axis: {
            y: {

                    type: 'timeseries',
                    tick: {
                        format: '%Y-%m-%d %H:%M:%S',
                        rotate: -90
                    }
            },
            x2: {
                show: true
            }
        },
   });