C3.js line chart

Line chart with the C3.js adapter

HTML

<script src="https://d26b395fwzu5fz.cloudfront.net/3.4.0/keen.min.js?date=2016-02-17"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
<script src="https://canvg.github.io/canvg/canvg.js"></script>
<script src="https://canvg.github.io/canvg/StackBlur.js"></script>
<script src="https://canvg.github.io/canvg/rgbcolor.js"></script>
<div id="timelineChart"></div>

JavaScript

var data = [["2018-07-27","2018-07-30","2018-08-01","2018-08-02","2018-08-03","2018-08-06","2018-08-07","2018-08-08","2018-08-09","2018-08-10","2018-08-13","2018-08-14","2018-08-16","2018-08-17","2018-08-20","2018-08-21","2018-08-22","2018-08-23","2018-08-24","2018-08-27","2018-08-28","2018-08-29","2018-08-30","2018-08-31","2018-09-03","2018-09-04","2018-09-05","2018-09-06","2018-09-07","2018-09-09","2018-09-10","2018-09-11","2018-09-12","2018-09-13","2018-09-14","2018-09-15","2018-09-17","2018-09-18","2018-09-20","2018-09-22","2018-09-26","2018-09-27","2018-09-28","2018-10-04","2018-10-05","2018-10-08","2018-10-11","2018-10-12","2018-10-13","2018-10-15","2018-10-16","2018-10-17","2018-10-18","2018-10-19","2018-10-22","2018-10-23","2018-10-24","2018-10-25","2018-10-26","2018-10-29","2018-10-30","2018-10-31","2018-11-01","2018-11-05","2018-11-06","2018-11-07","2018-11-08","2018-11-09","2018-11-12","2018-11-13","2018-11-14","2018-11-15","2018-11-16","2018-11-19","2018-11-20","2018-11-21","2018-11-22","2018-11-23","2018-11-26","2018-11-27","2018-11-28","2018-11-29","2018-11-30","2018-12-03","2018-12-04","2018-12-05","2018-12-06","2018-12-07","2018-12-10","2018-12-11","2018-12-12","2018-12-13","2018-12-14","2018-12-17","2018-12-18","2018-12-19","2018-12-20","2018-12-21"],["Count","4","2","16","115","129","19","14","34","46","4","20","28","24","14","9","24","61","4","38","183","83","54","12","26","49","48","108","147","200","19","34","44","12","4","77","1","21","3","12","3","3","1","24","18","11","24","17","103","20","66","221","163","162","47","65","86","5","4","15","62","86","44","7","10","17","40","31","18","36","46","51","55","53","60","51","21","122","44","14","41","7","77","47","54","66","24","39","54","74","86","117","60","53","9","5","22","32","2"]];
var chart = c3.generate({
			bindto: '#timelineChart',
			data: {
				columns: [data[1]]
			},
			axis: { x: {
				type: 'category',
				categories: data[0],
        height: 130
			}},
			grid: {
				x:...