0

I am trying to add a toolhelper, more specifically this one to the d3.layout.partition example. The point is that when you hover over a rectangle (i.e. an element in the tree) the toolbar shows up displaying information about that section. I have previously been able to make the toolbar show up in the sunburst example, like so:

path.enter().append("path")
            .attr("id", function(d, i) { return "path-" + i; })
            .attr("d", arc)
            .attr("fill-rule", "evenodd")
            .style("fill", color)
            .call(d3.helper.tooltip()
                .attr({class: function(d, i) {
                    return d + ' ' +  i + ' A';
                }})
                .style( {font: '10px sans-serif'} )
                .text(function(d, i) {
                    return d.reportHTML;
                })
            )
            .on("click", click);

But... When I try something similar to the partition example:

g.append("svg:rect")
      .attr("width", root.dy * kx)
      .attr("height", function(d) { return d.dx * ky; })
      .attr("class", function(d) { return d.children ? "parent" : "child"; })
      .call(d3.helper.tooltip()
                .attr({class: function(d, i) {
                    return d + ' ' +  i + ' A';
                }})
                .style( {font: '10px sans-serif'} )
                .text(function(d, i) {
                    return d.reportHTML;
                })
            )
            .on("click", click); 

The toolbar does not display. How can I adapt it so that it works with the partition layout as well?

The error messages I get in the web console when I try to hover over the rectangles are these:

Uncaught TypeError: Object #<Object> has no method 'indexOf'
Uncaught TypeError: Object #<Object> has no method 'mouse'
VividD
  • 10,456
  • 6
  • 64
  • 111
Perry
  • 1,709
  • 1
  • 17
  • 25

0 Answers0