Я не могу вставить график в реальном времени на свою страницу Flask

Question

У меня есть веб-приложение Flask-SocketIO, в котором некоторые данные генерируются моим скриптом Python и отправляются на мой интерфейс JS. Я сейчас пытаюсь поместить эти данные в график. Вот как это должно выглядеть: пользователь открывает веб-страницу, и он должен видеть обновление данных, но он также должен видеть данные ДО того, как он открыл веб-страницу, поэтому мне нужны ОБА в реальном времени / обновленные и прошлые данные. Теперь большая проблема в том, что мне удалось построить график в реальном времени, но я понятия не имею. Когда я открываю свою веб-страницу, я вижу обновление диаграммы, но не вижу прошлых данных на диаграмме, я буквально все перепробовал.

Вот часть кода javascript, которую я сделал, и здесь вы можете найти остальную часть кода (часть Python + часть html)

$(document).ready(function() {
  //connect to the socket server.
  var socket = io.connect('http://' + document.domain + ':' + location.port + '/test');
  var numbers_received = [];


  //receive details from server
  socket.on('newnumber', function(msg) {
    console.log("Received" + msg.number);
    //maintain a list of ten numbers
    if (numbers_received.length >= 1) {
      numbers_received.shift()
    }


    numbers_received.push(msg.number);
    numbers_string = '';
    for (var i = 0; i < numbers_received.length; i++) {
      numbers_string = numbers_string + '<p>' + numbers_received[i].toString() + '</p>';
    }
    $('#log').html(numbers_string);
  });






  function getData() {

                }
                Plotly.plot('chart',[{
                    y:[numbers_received[1]],
                    type:'line'
                }]);

                console.log('TEST' + numbers_received[0]);

                var cnt = 0;
                setInterval(function(){
                    Plotly.extendTraces('chart',{ y:[[numbers_received[0]]]}, [0]);
                    cnt++;
                    if(cnt >10000000) {
                        Plotly.relayout('chart',{
                            xaxis: {
                                range: [cnt-9,cnt]
                            }
                        });
                    }
                },15);

});

Что мне делать? Перестанете пытаться использовать библиотеку Javascript для своей диаграммы, использовать библиотеку Python и генерировать диаграмму прямо из Python (не думал ли переделать все приложение на Python Dash, но это не бесплатно)? Работать над моим кодом Javascript, пока я не найду способ, подразумевая, что это возможно? Просто использовать другую библиотеку?

Пожалуйста, каждый кусочек помощи высоко ценится, я пытался продвигаться вперед с этим в течение недели, но я просто не могу найти способ, заранее спасибо