JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

TypeScript

var chart = new CanvasJS.Chart('chartContainer', {
	animationEnabled: true,
	animationDuration: 800,
  title: {
    text: 'Basic Column Chart',
  },
  axisX: {
          title: 'Variables',
          titleFontSize: 18,
          labelAngle: 90,
  },
  data: [
    {
      type: 'column',
      showInLegend: true,
      legendText: 'R2',
      dataPoints: [
        { y: .91, label: "name" },
        { y: .92, label: "name2"  },
        { y: .93, label: "Variable Name"  },
        { y: .94, label: "Long Variable Name"  },
        { y: .95, label: "test"  },
        { y: .96, label: "name"  },
        { y: .97, label: "name"  },
        { y: .98, label: "name"  },
        { y: .99, label: "name"  },
				{ y: .91, label: "name" },
        { y: .92, label: "name2"  },
        { y: .93, label: "Variable Name"  },
        { y: .95, label: "test"  },
        { y: .96, label: "name"  },
        { y: .97, label: "name"  },
        { y: .98, label: "name"  },
        { y: .99, label: "name"  },
        { y: .81, label: "name"  },
        { y: .80, label: "name"  },
				{ y: .79, label: "name"  },
        { y: .78, label: "name"  },
        { y: .79, label: "name"  },
        { y: .78, label: "name"  },
      ],
    },
    {
      type: 'column',
      showInLegend: true,
      legendText: 'Q2',
      dataPoints: [
        { y: .91, label: "name" },
        { y: .91, label: "name2"  },
        { y: .92, label: "Variable Name"  },
        { y: .93, label: "Long Variable Name"  },
        { y: .94, label: "test"  },
        { y: .95, label: "name"  },
        { y: .96, label: "name"  },
        { y: .97, label: "name"  },
        { y: .98, label: "name"  },
        { y: .92, label: "name" },
        { y: .93, label: "name2"  },
        { y: .94, label: "Variable Name"  },
        { y: .95, label: "test"  },
        { y: .96, label: "name"  },
        { y: .97, label: "name"  },
        { y: .98, label: "name"  },
        { y: .99, label: "name"  },
        { y: .80, label:...