Data Visualization Projects - Visualize Data with a Bar Chart

JavaScript
1

Tell us what’s happening:

Describe your issue in detail here.
I don’t understand.
The bars are not showing, and I am failing all the test
What am i doing wrong?

Your code so far


var data = [4, 8, 15, 16, 23, 42];

const svg = d3.select("body")
                  .append("svg")
                  .attr("width", 100)
                  .attr("height", 500);

 svg.selectAll("rect")
  .data(data)
  .enter()
  .append("div")

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36

Challenge Information:

Data Visualization Projects - Visualize Data with a Bar Chart

2

The problem is related to the position of your <script> .. </script> within the html document.

No body element exists yet at the moment that your script is being executed. That means that d3.select("body") will be empty, and no div.chart is being appended.

Try to move your <script> .. </script> inside the <body> .. </body> part. This will guarantee that the body element exists when your code is being executed
Create Bar Chart using D3

3

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