将Grafana集成到Web应用程序中

时间:2016-07-21 16:17:50

标签: influxdb grafana

有一点背景,我一直在使用BCI(脑计算机界面)和多通道脑电图监测大脑活动。当用户启动具有BCI上限的会话时,来自每个通道的原始数据流将存储到Influxdb中。

我可以实时查看这些数据,这是我通过将我的数据库与Influfdb集成在Grafana中成功实现的,如下面显示的第1频道

EEG data for Channel 1

但是,我的最终目标是创建一个Web应用程序,用户可以在该应用程序中实时登录或查看当前的流式会话或任何之前的会话。 Grafana的问题在于,与现有的Web应用程序集成/嵌入并不容易。我查看了Embed Panel,但这使我只能添加图表的快照,而我需要实时将数据连续流式传输到图表。

非常感谢任何帮助,并提前致谢!

2 个答案:

答案 0 :(得分:3)

Grafana没有“javascript库”,可以将其加载到页面中以在外部Web应用程序(relevant github issue here)中重新创建面板。

如果您愿意使用grafana之外的其他内容,您可以使用js驱动程序(如influxdb-nodejsinfluent连接到Influxdb以获取数据,然后使用绘图库(例如{{3 }},flotplotlyd3)重新创建图表。这将是解决问题的典型方法,但它确实需要您更多的开发时间。

但是,如果您确实想使用grafana,现在可以使用iframe smoothie charts embed a grafana panel进入外部应用程序,如下所示:

<iframe 
    src="https://snapshot.raintank.io/dashboard-solo/snapshot/y7zwi2bZ7FcoTlB93WN7yWO4aMiz3pZb?from=1493369923321&to=1493377123321&panelId=4" 
    width="650" height="300" frameborder="0">
</iframe>

答案 1 :(得分:1)

就我而言,我只是单击面板->有一个“共享”按钮->“嵌入”标签-您拥有iframe标签,可以将其复制粘贴到您的网站中。