Need help on d3 project

JavaScript
1

When I hover over the graph, it returns undefined values. I couldn’t figure it out

https://codepen.io/ozanbaskan/pen/NWbbKLy

tooltip
          .html(
            years[i] +
              '<br>' +
              '$' +
              GDPs[i] +
              ' Billion'
          )
2 
.on('mouseover', function (d, i) {

Here you’re using i like it is an index but this is not actually what it is.

I suggest you console.log both d and i to check it out.

3

In the example project, it is used exactly like that and working.

https://codepen.io/freeCodeCamp/pen/GrZVaM

or I didn’t get it :confused:

4

In your project you use the latest version of d3.js and the example project uses version 4.2.2. One of the differences is the way events are handled.

That’s why I really suggest console.logging the values that you’re using instead of looking at the solution.

.on('mouseover', function (d, i) {
    console.log(d, i);

years[i] is undefined because you expect function arguments to be data and index but are they really what you think they are?

1 Like
5

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.