title: d3js highlighting sunburst path when hovering on label
body: <p>I'm new to d3.js, and I managed to pull together (from different examples) the following <a href="https://jsfiddle.net/atg92qqo/" rel="nofollow">jsfiddle</a>.</p>
  
  <p>It's a typical sunburst, and I have labels in a legend.</p>
  
  <p>I'd like to add the functionality that when you hover (or click) on a legend label it behaves exactly as if I was on that element (highlighting the path).</p>
  
  <p>I suspect I need to add a "<code>.on("mouseover", XXX)</code>" on the following portion of code, but it's not clear to me how to complete the task</p>
  
  <pre><code>   g.append("svg:rect")
        .attr("rx", li.r)
        .attr("ry", li.r)
        .attr("width", li.w)
        .attr("height", li.h)
        .style("fill", function(d) { return d.value; });
  </code></pre>
  
  <p>Thank you!</p>
  
  <p>Being a jsfiddle it would be immensely appreciated a fork on that jsfiddle with the answer (apart from the answer here for posterity of course) ;)</p>
  
  <p><strong>EDIT:</strong> I changed the link to jsfiddle as it did not show the legend properly</p>