在文本标签中显示实时数据d3.js

Question

我有一个线形图，在数据从数据库以5秒的间隔拉入时正在更新。

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

我想添加标签，将显示日期/时间（存储为变量dateTimeTaken）图的右上角，并作为新的数据更新拉到这个标签？

我一直在线上搜索，似乎无法找到任何地方的例子 - 任何人都可以帮忙吗？

Answer 1

它应该很容易。基于你的要点，如：

d3.json("getdata.php", function(error,data) { 
    data.forEach(function(d) { 
    d.dateTimeTaken = parseDate(d.dateTimeTaken); 
    d.reading = +d.reading; 
    }); 
var maxDate = d3.max(data, function(d) { return d.dateTimeTaken; } 

svg.selectAll(".timeDisplay") 
    .data([maxDate]) 
    .text(function(d) { return d; }) 
    .enter() 
    .append("text") 
    .attr("class", "timeDisplay") 
    .attr("x", width) 
    .attr("y", 0) 
    .attr("text-anchor", "end") 
    .text(dateTimeTaken); 

把它放在你的“updateData”函数中。 鉴于您正在接收多个数据项，您可能需要对数据执行“d3.max（）”调用以确定要显示的日期。