Dynamically update treemap elements with D3.js

Question

I'm experimenting with implementing a treemap using D3.js and the following example: http://mbostock.github.com/d3/ex/treemap.html

So far it works pretty good.

My problem is if I would like to refresh the treemap items using transition for a completely new set of data, I cannot do it. I can only do this if I reinitialize the treemap object.

Let's take a simple example:

DATASET1: PROD1, PROD2, PROD3... DATASET2: LOC1, LOC2, LOC3, LOC4...

I would like to have a transition animation when switching between the two datasets, which have different number of elements and different sizes (values). Again, I could only do it by basically removing the elements of the parent DIV id ($("#treemap_1").empty();) and then recreate the whole treemap with the new dataset.

Sorry, I'm very new to D3.js, so maybe it's something obvious. :)

Thanks & best regards, Bence

Answer 1

It could be the same as my question.

The problem is with the treemap being sticky.