score:13

Accepted answer

First, before addressing the transition issue, you need to refactor things a bit. You're going to want to call an update(newData) function every time your data changes, and have this function do all the necessary updates.

This tutorial by mbostock describes exactly the "general update pattern" you'll need.

Parts II and III then go on to explaining how to work transitions into this pattern.

They're very short. And once you understand them, you'll have just about all the info you need to do this.

score:1

I guess you just have to specify .transition() function after .data(newData) function

In the following example Y2 is a node in a JSON file, where Y1 was the previous one used

Example:

//Creating the button
var button = d3.select("body")
.append("input")
.attr("type","button")
.attr("value", "A button");

//Transitioning process
button.on("click", function()
{   circles
    .data(data.Y2)
    .transition()
    .attr("cx", function(d)
    {
        return d[0];
    }
    )
    .attr("cy", 300);
}
)

Related Query

More Query from same tag