过渡线/路径描绘“实时”数据D3

时间:2013-02-09 22:18:48

标签: d3.js

继上一篇文章之后:

"Live" graph d3.js with simulated data

我每隔1分钟从数据库中提取数据。 json数组正在使用新的“实时”数据进行更新,但是当x和y轴都在更新时,行/路径不是?

https://gist.github.com/Majella/5fc4cd5f41a6ddf2df23

我无法弄清楚为什么会这样 - 有人可以帮忙吗?

PS - 尝试将data.push()和data.shift()添加到“SetInterval”函数以允许新数据 - 似乎没有任何区别 - 并且轴被压缩并且难以阅读随着新数据的增加。

1 个答案:

答案 0 :(得分:0)

你提到轴被压缩了。这表明您的数据不断被添加到MySQL表中,但是当您运行查询时,您将 所有 时间值拉出来。

我是否可以建议您在MySQL查询中包含一行,该行仅在您要显示的时间长度内提取数据量。

例如,如果您想要显示60分钟的数据,只需使用适当的'WHERE'语句选择最后一小时的结果...

SELECT dateTimeTaken, reading FROM TestSourceSampleData 
WHERE dateTimeTaken BETWEEN NOW()-INTERVAL 1 HOUR AND NOW()
GROUP BY dateTimeTaken

(查询未经测试)

您可能想要尝试的另一件事是在您的html文件的第14行中使用v3 of d3.js(d3.v3.js)。这意味着我认为你必须像这样在d3.json行中包含错误陷阱;

d3.json("getdata.php", function(error, data) {

第45和131行。

尝试一下这些想法。