d3.js updating visual

I have a treemap I put together with d3.js. I populate the data via getJSON. It works great. However, I have this functionality in a setInterval method and it doesnt seem to be refreshing itself.

    var treemap = d3.layout.treemap()
.padding(4)
.size([w, h])
.value(function(d) { return d.size; });

var svg = d3.select("#chart").append("svg")
.style("position", "relative")
.style("width", w + "px")
.style("height", h + "px");



function redraw3(json) {
  var cell = svg.data([json]).selectAll("g")
      .data(treemap)
    .enter().append("g")
      .attr("class", "cell")
      .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });

  cell.append("rect")
      .attr("width", function(d) { return d.dx; })
      .attr("height", function(d) { return d.dy; })
      .style("fill", function(d) { return d.children ? color(d.data.name) : null; });

  cell.append("text")
      .attr("x", function(d) { return d.dx / 2; })
      .attr("y", function(d) { return d.dy / 2; })
      .attr("dy", ".35em")
      .attr("text-anchor", "middle")
      .text(function(d) { return d.children ? null : d.data.name; });

}



setInterval(function() {
d3.json("http://localhost:8080/dev_tests/d3/examples/data/flare2.json", function(json) {
redraw3(json);
});
}, 3000);

My question specifically, is why when I change data in the json file doesn't it show up 3 seconds later in the treemap?

Thank you in advance.

What's in the data? Because if the data array has the same length, the enter() selection (which corresponds to previously unbound data) will have a length of zero. Mike Bostock wrote a great tutorial called Thinking with Joins, which I would recommend reading before you go any further.

The svg.data() call seems redundant, and for clarity's sake I'd recommend doing this instead:

var leaves = treemap(json);
console.log("leaves:", leaves); // so you can see what's happening

// cell here is the bound selection, which has 3 parts
var cell = svg.selectAll("g")
  .data(leaves);
// you might want to console.log(cell) here too so you can take a look

// 1. the entering selection is new stuff
var entering = cell.enter()
  .append("g")
entering.append("rect")
  // [update rectangles]
entering.append("text")
  // [update text]

// 2. the exiting selection is old stuff
cell.exit().remove();

// 3. everything else is the "updating" selection
cell.select("rect")
  // [update rectangles]
cell.select("text")
  // [update text]

You can also encapsulate the updating of cells in a function and "call" it on both the entering and updating selections, so you don't have to write the same code twice:

function update() {
  cell.select("rect")
    // [update rectangles]
  cell.select("text")
    // [update text]
}

entering.append("rect");
entering.append("text");
entering.call(update);

cell.call(update);