Here is the code with the input data. Thank you.
<!DOCTYPE HTML> <html> <head> <script> window.onload = function () { var dataPoints1 = []; var dataPoints2 = []; var humidorT = [69.8, 69.8, 69.8, 69.8, 69.8, 69.8, 69.8, 69.8, 71.6, 71.6, 71.6, 71.6, 71.6, 71.6, 71.6, 71.6, 71.6, 71.6, 71.6, 71.6, 71.6, 69.8, 68.0, 64.4, 66.2, 66.2, 68.0, 69.8, 71.6, 71.6, 73.4, 75.2, 75.2, 75.2, 75.2]; var humidorH = [40.0, 40.0, 41.0, 43.0, 43.0, 43.0, 43.0, 45.0, 47.0, 46.0, 48.0, 50.0, 49.0, 46.0, 47.0, 44.0, 43.0, 44.0, 44.0, 44.0, 43.0, 44.0, 41.0, 42.0, 41.0, 40.0, 39.0, 40.0, 39.0, 39.0, 38.0, 35.0, 36.0, 37.0, 38.0]; var date = ['2018-04-16 06:00:21', '2018-04-16 06:00:21', '2018-04-16 05:00:14', '2018-04-16 04:00:08', '2018-04-16 03:00:21', '2018-04-16 02:00:14', '2018-04-16 01:00:07', '2018-04-16 00:00:21', '2018-04-15 23:00:14', '2018-04-15 22:00:07', '2018-04-15 21:00:20', '2018-04-15 20:00:10', '2018-04-15 19:00:21', '2018-04-15 18:00:14', '2018-04-15 17:00:07', '2018-04-15 16:00:19', '2018-04-15 15:00:12', '2018-04-15 14:00:23', '2018-04-15 13:00:16', '2018-04-15 12:00:09', '2018-04-15 11:00:22', '2018-04-15 10:00:16', '2018-04-15 09:00:09', '2018-04-15 08:00:22', '2018-04-15 07:00:15', '2018-04-15 06:00:08', '2018-04-15 05:00:22', '2018-04-15 04:00:15', '2018-04-15 03:00:08', '2018-04-15 02:00:21', '2018-04-15 01:00:14', '2018-04-15 00:00:08', '2018-04-14 23:00:21', '2018-04-14 22:00:11', '2018-04-14 21:00:25']; var length = 35; var chart = new CanvasJS.Chart("chartContainer", { zoomEnabled: true, title: { text: "Share Value of Two Companies" }, axisX: { title: "Time Stamp" }, axisY:{ prefix: "", includeZero: false }, toolTip: { shared: true }, legend: { cursor:"pointer", verticalAlign: "top", fontSize: 22, fontColor: "dimGrey", itemclick : toggleDataSeries }, data: [{ type: "line", xValueType: "dateTime", yValueFormatString: "####.00", //xValueFormatString: "MM-dd-YYYY hh:mm:ss TT", showInLegend: true, name: "Temerature", dataPoints: dataPoints1 }, { type: "line", xValueType: "dateTime", yValueFormatString: "####.00", showInLegend: true, name: "Humidity" , dataPoints: dataPoints2 }] }); function toggleDataSeries(e) { if (typeof(e.dataSeries.visible) === "undefined" || e.dataSeries.visible) { e.dataSeries.visible = false; } else { e.dataSeries.visible = true; } chart.render(); } function updateChart(length) { // pushing the new values var i; for(i = 0; i < length; i++){ dataPoints1.push({ x: date[i], y: humidorH[i] }); dataPoints2.push({ x: date[i], y: humidorT[i] }); } } updateChart(length); chart.render(); } </script> </head> <body> <div id="chartContainer" style="height: 300px; width: 100%;"></div> <script src="https://cdn.canvasjs.com/canvasjs.min.js"></script> </body> </html>