图表始终为空

Question

我正试图在我的网页上添加一个Plotly图表。数据正在通过SocketIO发送到Javascript，但是图表为空。

我不明白为什么，因为数据被推送到arr。有什么建议吗？

var arr = [];

socket.on('two', function(msg) {

    arr.push(msg.num)

    console.log(arr)
  });

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

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

Answer 1

Socket.io on（）函数是异步的。因此，Plotly代码不会等待其完成，因此仅接收一个空数组作为其数据。在通过Socket.io发出远程数据请求之前，请尝试实例化Plotly图，然后在on（）方法的响应函数中更新该图。