Marimekko chart cell titles not updating

Question

I'm making a visualization for the titanic data set https://www.kaggle.com/c/titanic/data, and after some search i found that the marimekko chart is the best visualization for this data set.

I looked at http://www.jasondavies.com/mekko/ and began to tweak the code a bit to fit it to my needs. My problem is that the cell titles (those appear after mouse - hover at a cell) do not update values. The first call to the function chart draws the titles correctly, then when i try to change the cell values using the transition function, the charts animates properly but the values in the cell titles do not change, they still have the old values when i hover at them.

The last line in the transition function is:

cellEnter.append("title")
        .text(function(d) { return d.children ? null : title(d); });

which seems to work the first time the chart is drawn, but it doesn't update the titles when the cell data changes.

Any ideas how to fix this ?

If you're curious to see the changes i made, have a look at working example http://codepen.io/hshihab/pen/PqWjmo

I just made a couple of small changes to Jason's original code to show my point.

Answer 1

As @Lars Kotthoff pointed out in the comments, the last line in the transition function should be changed to:

cellEnter.append("title");
cellUpdate.select("title")
  .text(function(d) {
    return d.children ? null : title(d);
  });