JSFiddle - React, Tailwind, and code Playground

by John Doe

HTML

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/c3/0.1.29/c3.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/c3/0.1.29/c3.js"></script>
<div class='diagrammstyle' style='float:right;margin-right:100px'>
<span id='diagramm_balken'>Balkendarstellung</span><br>
<span id='diagramm_areal'>Arealdarstellung</span></div>
<div id="chart"></div>

CSS

#diagramm_balken {
  cursor:pointer;
	background-color:#FFFFDF;
}

JavaScript

var chart = c3.generate({
    bindto: '#chart',
    data: {
      columns: [
        ['data1', 30, 200, 100, 400, 150, 250],
        ['data2', 50, 20, 10, 40, 15, 25]
      ]
    }
});