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", {
  title:{
    text: "Solar by Day"
  },
  subtitles:[{
    fontSize: 20
  }],
  legend: {
    horizontalAlign: "center", 
    verticalAlign: "top",  
    fontSize: 15
  },
  axisX: {
    title: "Days of Month",
    tickThickness: 1,
    labelFontSize: 10,
    labelAngle: 0,
    interval: 1
  },
  axisY: {
    title: "kWh",
    labelFontSize: 10,
    interval: 1
  },
  data: [{
    type: "column",
    dataPoints: [
      { label: "1", x: 1, y: 34.69},
      { label: "2", x: 2, y: 25.9},
      { label: "3", x: 3, y: 29.68},
      { label: "4", x: 4, y: 38.18},
      { label: "5", x: 5, y: 34.57},
      { label: "6", x: 6, y: 36.35},
      { label: "7", x: 7, y: 36.79},
      { label: "8", x: 8, y: 30.81},
      { label: "9", x: 9, y: 36.9},
      { label: "10", x: 10, y: 39.47},
      { label: "11", x: 11, y: 40.13},
      { label: "12", x: 12, y: 38.46},
      { label: "13", x: 13, y: 37.61},
      { label: "14", x: 14, y: 37.5},
      { label: "15", x: 15, y: 32.69},
      { label: "16", x: 16, y: 35.19},
      { label: "17", x: 17, y: 26.41},
      { label: "18", x: 18, y: 29.46},
      { label: "19", x: 19, y: 10.9},
      { label: "20", x: 20, y: 19.58},
      { label: "21", x: 21, y: 31.29},
      { label: "22", x: 22, y: 38.54},
      { label: "23", x: 23, y: 18.98},
      { label: "24", x: 24, y: 35.61},
      { label: "25", x: 25, y: 39.68},
      { label: "26", x: 26, y: 36.86},
      { label: "27", x: 27, y: 30.35},
      { label: "28", x: 28, y: 20.71},
      { label: "29", x: 29, y: 37.68},
      { label: "30", x: 30, y: 37.92},
      { label: "31", x: 31, y: 38.95},
      { label: "1", x: 32, y: 38.41},
      { label: "2", x: 33, y: 36.4},
      { label: "3", x: 34, y: 25.91},
      { label: "4", x: 35, y: 16.93},
      { label: "5", x: 36, y: 32.88},
      { label: "6", x: 37, y: 36.19},
      { label: "7", x: 38, y: 33.45},
      { label: "8", x: 39, y: 30.68},
      { label: "9", x: 40, y: 33.36},
...