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

function getDataPointsFromCSV(csv) {
  var dataPoints, csvLines, points;
  dataPoints = csvLines = points = [];
  csvLines = csv.split(/[\r?\n|\r|\n]+/);
  for (var i = 1; i < csvLines.length; i++)
    if (csvLines[i].length > 0) {
      points = csvLines[i].split(",");
      chart.options.data[0].dataPoints.push({label: points[0], y: parseFloat(points[1])});
      chart.options.data[1].dataPoints.push({label: points[0], y: parseFloat(points[2])});
    }
}

var chart = new CanvasJS.Chart("chartContainer", {
  zoomEnabled: true,
  theme: "dark1",
  title: {
    text: "Chiller Temp Logging"
  },
  axisY:{
    title: "Temp",
  },
  axisY2: {
   title: "Humidity"
  },
  data: [
    { 
      type: "spline", 
      name: "Temp",
      showInLegend: true,
      dataPoints: [] 
    },
    { 
      type: "spline", 
      name: "Humidity",
      axisYType: "secondary",
      showInLegend: true,
      dataPoints: [] 
    },
  ]
});

$.get("https://docs.google.com/spreadsheets/d/e/2PACX-1vQkg2y4kqlj2iRyFyUjZmG3uezNXcrWQ19Ro44QDTNzs_QjF55WvAgIQhc8azC1bOGirEXC4XE7t6UZ/pub?output=csv", function(data) {
  getDataPointsFromCSV(data);
  chart.render();
});