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>

JavaScript

var chart = new CanvasJS.Chart("chartContainer", {
  animationEnabled: true,
  title:{
    text: "Google – Consolidated Quarterly Revenue",
    fontFamily: "arial black",
    fontColor: "#695A42"
  },
  axisY:{
    valueFormatString:"$#0bn",
    gridColor: "#B6B1A8",
    tickColor: "#B6B1A8"
  },
  toolTip: {
    shared: true,
    //content: toolTipContent
  },
  data: [{
    type: "stackedColumn",
    showInLegend: true,
    color: "#696661",
    name: "Q1",
    dataPoints: [
      { y: 840, label: "4221643" },
      { y: 4160, label: "4221809" },
      { y: 9028, label: "4226799" },
      { y: 0, label: "4228178" },
      { y: 0, label: "4228181" },
      { y: 500, label: "4228399" },
      { y: 1564, label: "4231730" },
      { y: 2780, label: "4231840" },
      { y: 520, label: "4232133" },
      { y: 2558, label: "4236167" }
    ]
  },{
    type: "stackedColumn",
    showInLegend: true,
    name: "Q2",
    color: "#EDCA93",
    dataPoints: [
      { y: 915, label: "4221643" },
      { y: 4127, label: "4221809" },
      { y: 1037, label: "4226799" },
      { y: 1506, label: "4228178" },
      { y: 1506, label: "4228181" },
      { y: 1859, label: "4228399" },
      { y: 162, label: "4231730" },
      { y: 87, label: "4231840" },
      { y: 1454, label: "4232133" },
      { y: 230, label: "4236167" }
    ]
  },{
    type: "stackedColumn",
    showInLegend: true,
    name: "Q3",
    color: "#695A42",
    dataPoints: [
      { y: 113, label: "4221643" },
      { y: 0, label: "4221809" },
      { y: 2207, label: "4226799" },
      { y: 0, label: "4228178" },
      { y: 0, label: "4228181" },
      { y: 0, label: "4228399" },
      { y: 0, label: "4231730" },
      { y: 0, label: "4231840" },
      { y: 0, label: "4232133" },
      { y: 0, label: "4236167" }
    ]
  },{
    type: "stackedColumn",
    showInLegend: true,
    name: "Q4",
    color: "#B6B1A8",
    dataPoints: [
      { y: 209.04, label: "4221643" },
      { y: 172.86, label: "4221809" },
      { y:...