JSFiddle - React, Tailwind, and code Playground

by alfredopacino

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 style="position: fixed;bottom: 0;left: 0;">
    <div id="chart" style="height: 150px;width: 800px;"></div>
</div>

CSS

#bottom {
position: absolute;
bottom: 0;
left: 0;
padding: 10px;
}

JavaScript

var xaxis= new Array();
	for (i=0;i<14;i++){
	xaxis[i]=2000+i;
	}
	
      var chart = c3.generate({
    data: {
	x: 'xaxis',
        json: {
            xaxis: xaxis,
			data2: [200, 130, 90, 240, 130, 220],
			data3: [300, 200, 160, 400, 250, 250],
			data4: [100, 430, 140, 300, 220, 210]
        }
    },
	 axes: {
            xaxis: 'x',
            data2: 'y'
          },
	axis: {
		y: {
            label: 'Y Label'
        },
          y2: {
            show: true,
			 label: 'Y2 Label'
          }
        }
});