JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.pureexample.com/js/flot/jquery.flot.min.js"></script>

    <body>
    <h1>Flot Examples</h1>

    <div id="placeholder" style="width:600px;height:300px;"></div>

    <p>You can update a chart periodically to get a real-time effect
    by using a timer to insert the new data in the plot and redraw it.</p>

    <p>Time between updates: <input id="updateInterval" type="text" value="" style="text-align: right; width:5em"> milliseconds</p>

JavaScript

$(function () {
    // we use an inline data source in the example, usually data would
    // be fetched from a server
     var cnt = 0
    var data = [], totalPoints = 10;
    function getRandomData() {
        if (data.length > 0)
            data = data.slice(1);

        // do a random walk
        while (data.length < totalPoints) {
            var prev = data.length > 0 ? data[data.length - 1] : 50;
            var y = prev + Math.random() * 10 - 5;
            cnt = cnt + 1;
            
            
            if (y < 0)
                y = 0;
            if (y > 100)
                y = 100;
            
            if(cnt == 8)
                y = 12;
            
            data.push(y);
            
            //alert(y);
         
        }

        // zip the generated y values with the x values
        var res = [];
       
        for (var i = 0; i < data.length; ++i)
            
            res.push([i, data[i]])
                
        
        return res;
    }

    // setup control widget
    var updateInterval = 3000;
    $("#updateInterval").val(updateInterval).change(function () {
        var v = $(this).val();
        if (v && !isNaN(+v)) {
            updateInterval = +v;
            if (updateInterval < 1)
                updateInterval = 1;
            if (updateInterval > 2000)
                updateInterval = 2000;
            $(this).val("" + updateInterval);
        }
    });

    // setup plot
    var options = {
        series: { shadowSize: 0 }, // drawing is faster without shadows
        yaxis: { min: 0, max: 100 },
        xaxis: { show: false }
    };
    var plot = $.plot($("#placeholder"), [ getRandomData() ], options);

     
    var tCnt = 6;
    function update() {
        plot.setData([ getRandomData() ]);
         var graphy = $('#placeholder').offset().top
         var graphx = $('#placeholder').offset().left;
         var points = plot.getData();
        
        
        if(tCnt > 0){
       ...