javascript - D3js Use element's current color in tooltip

Question

Been learning D3.js for a couple weeks now. I'm going back and cleaning up some of my code, making it a bit more efficient. I have a paired bar chart, on mouse-over a tooltip is generated. The title in the tooltip matches the color of the particular bar.

This is the deisred effect. However, I'm statically setting the color from my color array:

d3.select("#tooltip")
        .select("#keyword")
        .style("color", colors[0][2])
        .text(d.keyword);

I would assume I could have it select the color of the current bar & apply it in the tooltip on mouseover. How can this be setup? (Maybe I'm mixing things with Jquery and using $this to select.)

I would rather use javascript to detect the color it is hovering over & apply that color. So I need some sort of anonymous function in place of colors[0][2]

Drew up a Fiddle to play around with full code.

Answer 1

干得好：

http://jsfiddle.net/VTJ5G/

只是将两个地方的相关代码更改为：

d3.select("#tooltip")
    .select("#keyword")
    .style("color", d3.select(this).style("fill"))
    .text(d.keyword);