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="chartContainer1" style="height: 360px; width: 100%;"></div>
<div id="chartContainer2" style="height: 360px; width: 100%;"></div>

JavaScript

var data = [{x: 1613323768000, y: 573, a: 1, b: 20, c: 1, d: 1, e: 11, f: 1, g: 800, h: 612, i: 0, j: 0},
            {x: 1613323440000, y: 600, a: 0, b: 20, c: 3, d: 0, e: 12, f: 72, g: 664, h: 468, i: 987, j: 269},
            {x: 1613322642000, y: 600, a: 0, b: 20, c: 3, d: 0, e: 12, f: 72, g: 664, h: 468, i: 987, j: 268},
            {x: 1613322506000, y: 574, a: 1, b: 20, c: 1, d: 1, e: 11, f: 1, g: 800, h: 612, i: 0, j: 0},
            {x: 1613321840000, y: 600, a: 0, b: 20, c: 3, d: 0, e: 12, f: 72, g: 664, h: 468, i: 987, j: 268},
            {x: 1613321240000, y: 577, a: 99, b: 21, c: 1, d: 1, e: 11, f: 0, g: 800, h: 612, i: 0, j: 0},
            {x: 1613321045000, y: 600, a: 0, b: 20, c: 3, d: 0, e: 12, f: 71, g: 664, h: 468, i: 987, j: 268},
            {x: 1613320243000, y: 600, a: 0, b: 21, c: 3, d: 0, e: 12, f: 71, g: 664, h: 468, i: 987, j: 268},
            {x: 1613319958000, y: 573, a: 99, b: 21, c: 1, d: 1, e: 11, f: 0, g: 800, h: 612, i: 0, j: 0}];


var chart1 = new CanvasJS.Chart("chartContainer1", {
  title: {
    text: "Temperature at Different Locations"
  },
   axisY: {
  	title: "Temperature (in °C)",
		suffix: " °C"
  },
  axisX: {
  	title: "Time"
  },
  toolTip: {
  	content: "<span style='\"'color: {color};'\"'>{x}</span>: <strong>{y}</strong>°C",
  },
  data: []
});
addData(chart1, "b");


var chart2 = new CanvasJS.Chart("chartContainer2", {
  title: {
    text: "Humidity at Different Locations"
  },
  axisY: {
  	title: "Humidity (in %)",
		suffix: " %"
  },
  axisX: {
  	title: "Time"
  },
  toolTip: {
  	content: "<span style='\"'color: {color};'\"'>{x}</span>: <strong>{y}</strong>%",
  },
  data: []
});
addData(chart2, "a");

//function to add data to individual chart
function addData(chart, parameter) {

  var dataSeries = [];
  var categorizedData = categorizeData(parameter);

  for (var key in categorizedData) {
    if (categorizedData.hasOwnProperty(key)) {
      dataSeries.push({
        type: "line",
        name:...