Question

这有点延续我原来的问题，可以在this page中找到（并包含完整的代码）

现在我有一个代码似乎在某些情况下正常工作但在其他情况下却没有。让我解释一下......

这是我的数据库的快照。

Dtg |温度

2016-04-03 10:28:07 26.4
2016-04-03 10:25:06 26.4
2016-04-03 10:22:05 26.4
2016-04-03 10:19:05 26.2
2016-04-03 10:16:04 26

如果下一条记录类似

2016-04-03 18:00:00 25

一切都运作良好。整个图表得到更新，散点图也随之移动。

但是，如果下一个记录是

2016-04-03 10:37:11 26.4
2016-04-03 10:34:08 26.3
2016-04-03 10:31:07 26.4

然后散点图remain位于同一位置，而图表的其余部分会更新。

非常感谢任何帮助。感谢

代码：

// ** Update data section (Called from the onclick)
function updateData() {

// Get the data again
data = d3.json("2301data.php", function(error, data) {
data.forEach(function(d) {
    d.dtg = parseDate(d.dtg);
    d.temperature = +d.temperature;
   // d.hum = +d.hum; // Addon 9 part 3
});


// Scale the range of the data again 
 x.domain(d3.extent(data, function(d) { return d.dtg; }));
 y.domain([0, 60]); // Addon 9 part 4

 var svg = d3.select("#chart1")
 var circle = svg.selectAll("circle").data(data)

svg.select(".x.axis") // change the x axis
        .transition()
        .duration(750)
        .call(xAxis);
    svg.select(".y.axis") // change the y axis
        .transition()
        .duration(750)
        .call(yAxis);
    svg.select(".line")   // change the line
        .transition()
        .duration(750)
        .attr("d", valueline(data));

circle.transition()
        .duration(750)
        .attr("cx", function(d) { return x(d.dtg); })

    // enter new circles
    circle.enter()
        .append("circle")
        .filter(function(d) { return d.temperature > 30 })
        .style("fill", "red")   
        .attr("r", 3.5) 
        .attr("cx", function(d) { return x(d.dtg); })

    // remove old circles
    circle.exit().remove()


});
}

D3JS Scatter描绘了不一致的行为

0 个答案: