JSFiddle - React, Tailwind, and code Playground

by richo

HTML

<div id="chartContainer" style="height: 370px; width: 100%;"></div>

JavaScript

window.onload = function () {
        var dataAmps = "";
        var dataPoints = [];
        var chart = new CanvasJS.Chart("chartContainer", {
            animationEnabled: true,
            theme: "light2",
            title:{
                text: "AMPS"
                },
            data: [{
                type: "line",
                dataPoints: dataPoints
                }
            ]
            });
        setInterval(function(){UpdateGraph()}, 1000);

        var UpdateGraph = function () {
            var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {
                var obj = JSON.parse(this.responseText);
                dataAmps = (obj.data[6].dataValue);
                }
            };
            console.log(dataAmps);
            chart.options.data = dataAmps;
            chart.render();
            xhttp.open("GET", "/data", true); xhttp.send();
        }
    }