Retrieving Date() object from JSON array

Working on the D3 GDP project. Having an issue displaying the month/year when the user hovers over an individual bar.

I can access the element of the array but not the date object inside it. For example when hovering over the first bar in the bargraph the tooltip displays 0 (the number of the array it represents, not the date that element of the array contains).

So instead of displaying 1947-01 on hover it displays 0. How do I access the date itselt and display that on hover?

The second parameter to callbacks that you pass in d3 functions are always indexes. So the mouseover callback should really be
function(d, i) {}, not function(d, dates).

But since you already have a dates array somewhere, you can access them like so:

.on('mouseover', function(d, i) {
  tooltip
    .html('<strong>$' + d + ' billion<br>' + dates[i] + '</strong>')
  // ...
})

After that it’s just formatting the dates to a more human-friendly format.

1 Like

That did the trick. I was going crazy on that one. I had no idea the parameter had to be ‘i’. I guess that’s one of the quirks of D3.