Question

我使用flask微框架开发了一个python web应用程序。我有一些由Bokeh和一些HTML5表生成的交互式图。我的问题是如何在飞行中更新我的表格和图表数据？

我应该使用线程类并设置计时器，然后每隔几秒钟重新运行我的代码并将更新的数据条目提供给表格和图形？

我还调查了flask-socketIO，但我找到的只是发送和接收消息，有没有办法将flask-socketIO用于此目的？

我还和Bokeh服务器一起工作过，我应该朝那个方向走吗？这是否意味着我需要运行两台服务器？我的烧瓶网络服务器和散景服务器？

我是这类工作的新手。如果你能详细解释我需要做什么，我感激不尽。

Answer 1

你真的在一个问两个问题。真的，你有两个问题。首先，您需要一种机制来定期让客户端访问您的表格和图表的更新数据。其次，您需要客户端将这些更新合并到页面中。

对于第一个问题，您基本上有两个选择。最传统的方法是定期向服务器发送Ajax请求（即在页面后台运行的请求）。另一种方法是使用WebSocket增强您的服务器，然后客户端可以建立永久连接，并且只要服务器有新数据，它就可以将其推送到客户端。使用哪个选项很大程度上取决于您的需求。如果更新的频率不是太高，我可能会使用后台HTTP请求而不用担心将Socket.IO添加到混合中，这有其自身的挑战。另一方面，如果你需要一个实时的，不断更新的页面，那么也许WebSocket是一个好主意。

客户端拥有新数据后，您必须处理第二个问题。您处理的方式特定于您正在使用的表格和图表。您基本上需要编写Javascript代码，将从服务器接收的这些新值传递到这些组件中，以便更新页面。遗憾的是，没有自动方式来进行更新。你可以显然抛弃当前页面并使用新数据从头开始重建它，但这看起来并不好看，所以你应该找到这些组件公开的哪种Javascript API来接收更新。

我希望这有帮助！

Answer 2

如果您已经在使用d3.js（我认为如果您使用散景），那么使用d3定时器比使用setInterval更优化，因为如果图形不可见，它不会继续运行requestAnimationFrame。但是，在我看来，setInterval更容易阅读。

function getData(){
    $.get( "ajax/test.html", function( data ) {
      $( ".result" ).html( data );
    });
}

var getDataCallback = function() {
    return function() {
        getData();
        d3.timer(getDataCallback(), 1000);
        return true;
    }
};

d3.timer(getDataCallback(), 10000);

在HTML5图形和表格中流式传输实时数据

2 个答案: