JSFiddle - React, Tailwind, and code Playground

by TheDiamondDoge

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script>

<input type="checkbox" id="infotype" value='S' checked/>
<label for="infotype">Infotype S</label>

<input type="checkbox" id="infotype" value='A' checked/>
<label for="moreTen">Infotype A</label>

<input type="checkbox" value='QWEQR' checked/>

<div id="container" style = "height = 20px; width = 50%">

</div>

CSS

div {
    height: 200px;
    width: 50%;
   
}

JavaScript

var jsonfile = [
  ["2", "6\/16\/2017", "ConditionalGo", "A"],
  ["5", "6\/16\/2017", "GoProject", "A"],
  ["7", "6\/16\/2017", "NoGoNow", "A"],
  ["4", "", "idea", "A"],
  ["9", "6\/16\/2017", "NoGO", "A"],
  ["6", "6\/29\/2017", "ConditionalGo", "S"],
  ["12", "6\/29\/2017", "GoProject", "S"],
  ["8", "", "idea", "S"],
  ["11", "29\/8\/17 9:00", "GoProject", "S"],
  ["10", "", "idea", "S"],
  ["13", "29\/8\/17 9:30", "GoProject", "S"],
  ["15", "29\/8\/17 10:00", "NoGoNow", "S"],
  ["14", "29\/8\/17 10:30", "Closed", "S"],
  ["24", "29\/8\/17 11:00", "NoGoNow", "S"],
  ["17", "29\/8\/17 11:30", "NoGo", "S"],
  ["20", "29\/8\/17 12:00", "GoProject", "S"],
  ["22", "31\/8\/17 14:00", "GoProject", "S"],
  ["17", "", "idea", "S"],
  ["23", "31\/8\/17 14:30", "GoProject", "S"],
  ["19", "", "idea", "S"],
  ["16", "31\/8\/17 16:00", "ConditionalGo", "S"],
  ["21", "", "idea", "S"],
  ["18", "31\/8\/17 16:30", "NoGo", "S"],
  ["27", "9\/29\/2017", "ConditionalGo", "S"],
  ["28", "9\/29\/2017", "GoProject", "S"],
  ["29", "9\/29\/2017", "GoProject", "S"],
  ["26", "", "idea", "S"],
  ["3", "11\/8\/2017", "GoProject", "S"],
  ["25", "11\/8\/2017", "GoProject", "S"],
  ["33", "11\/8\/2017", "ConditionalGo", "S"],
  ["35", "11\/21\/2017", "NoGo", "S"],
  ["36", "11\/21\/2017", "NoGo", "S"],
  ["32", "11\/8\/2017", "idea", "S"],
  ["37", "11\/21\/2017", "NoGo", "S"],
  ["38", "11\/21\/2017", "NoGo", "S"],
  ["39", "11\/21\/2017", "NoGo", "S"],
  ["40", "11\/21\/2017", "NoGo", "S"],
  ["34", "12\/8\/2017", "NoGo", "S"],
  ["30", "1\/12\/2018", "ConditionalGo", "S"],
  ["41", "3\/1\/2018", "GoProject", "S"],
  ["43", "3\/16\/2018", "GoProject", "S"],
  ["45", "3\/16\/2018", "GoProject", "S"],
  ["42", "", "idea", "S"],
  ["47", "3\/16\/2018", "GoProject", "S"],
  ["44", "", "idea", "S"],
  ["31", "3\/21\/2018", "GoProject", "S"],
  ["46", "", "idea", "S"],
  ["48", "4\/13\/2018", "GoProject", "S"],
  ["50", "4\/13\/2018", "GoProject", "S"],
  ["49", "4\/27\/2018", "idea",...