c3 testing

well > welltest

by sqiudward

HTML

<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.10/d3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
<h1>
  hi
</h1>
<div id='myPlot'></div>

JavaScript

var elementID = "#myPlot";
	var myData = {};

	myData.x = 'x';
	myData.xFormat = "%Y-%m-%d";
	
	myX = ["2017-07-04","2017-07-25"];
	myY = [15, 30];
	myX.splice(0, 0, 'x');
	myY.splice(0, 0, 'New Reports');
	myData.columns = [];
	myData.columns.push(myX);
	myData.columns.push(myY);
  console.log(myData);
	var chart = c3.generate({
	  bindto: elementID,
	  data: myData,
	  size: {
	    height: 480,
	    width: 400,
	  },
	  bar: {
	    width: {
	      ratio: 0.5 // this makes bar width 50% of length between ticks
	    }
	    // or
	    //width: 100 // this makes bar width 100px
	  },
	  axis: {
	    x: {
	     type: "line",
        tick: {
                values: ['a', 'b']
            }
	    },
      
	  }
	})