** What’s happening:**
I understand the D3 tooltip lesson, and I’ve triple-checked my answer against the help post, but the lesson still won’t pass. The task was to add a title element to each bar and put the data into the tooltip with a callback function, and it appears to be working as it should in the preview.
None of the tests are passing, so I don’t have a direction to go in. I’ve tried with and without a semicolon at the end of the chain. My code appears to be exactly the same as the help post solution, but it still won’t work. I’ve slept on the problem, and searched around for someone facing the same issue, and I can’t figure out anything. Is there something I’m missing here? Or is there an error happening with the test itself?
** Code so far, excluding HTML**
(my part of the code is between the comments)
const dataset = [12, 31, 22, 17, 25, 18, 29, 14, 9];
const w = 500;
const h = 100;
const svg = d3.select("body")
.append("svg")
.attr("width", w)
.attr("height", h);
svg.selectAll("rect")
.data(dataset)
.enter()
.append("rect")
.attr("x", (d, i) => i * 30)
.attr("y", (d, i) => h - 3 * d)
.attr("width", 25)
.attr("height", (d, i) => d * 3)
.attr("fill", "navy")
.attr("class", "bar")
// Add your code below this line
.append("title")
.text((d) => d);
// Add your code above this line
svg.selectAll("text")
.data(dataset)
.enter()
.append("text")
.text((d) => d)
.attr("x", (d, i) => i * 30)
.attr("y", (d, i) => h - (d * 3 + 3))
** Browser information:**
User Agent is: Mozilla/5.0 (X11; Linux x86_64; rv:100.0) Gecko/20100101 Firefox/100.0
Challenge: Add a Tooltip to a D3 Element
Link to the challenge: