javascript - 实时数据图

Question

我想构建一个基于 Web 的实时数据图，我正在研究不同的选项，例如：

HTML5画布
具有图形支持的 JS 库，例如 Extjs

实时我的意思是，客户端轮询 Web 服务器每秒说一次，或者使用反向 ajax；服务器在可用时将数据推送到客户端。

你能推荐一些吗？

score 16 · Accepted Answer

16

还有更适合此用例的SmoothieCharts 。

于 2011-07-22T11:23:15.323 回答

score 15 · Accepted Answer

您可能需要考虑使用Flot ，这是一个基于 jQuery的开源绘图库。

我假设实时您的意思是图表将自动更新。如果您使用 AJAX 轮询以 1 秒的间隔获取和绘制数据，以下是您的代码的外观：

function fetchData() {
   $.ajax({
      url:      'json_fetch_new_data.php',
      method:   'GET',
      dataType: 'json',
      success:  function(series) {
         var data = [ series ];

         $.plot($('#placeholder'), data, options);
      }
   });

   setTimeout(fetchData, 1000);
}

请务必查看以下演示以查看它的实际效果（单击“轮询数据”按钮）：