I need help solving this D3 challenge

Tell us what’s happening:
I need help to complete this challenge on D3

Your code so far


<body>
<script>
  const dataset = [
                [ 34,    78 ],
                [ 109,   280 ],
                [ 310,   120 ],
                [ 79,    411 ],
                [ 420,   220 ],
                [ 233,   145 ],
                [ 333,   96 ],
                [ 222,   333 ],
                [ 78,    320 ],
                [ 21,    123 ]
              ];


  const w = 500;
  const h = 500;

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

  svg.selectAll("circle")
     .data(dataset)
     .enter()
     .append("circle")
     .attr("cx", (d, i) => d[0])
     .attr("cy", (d, i) => h - d[1])
     .attr("r", 5);

  svg.selectAll("text")
     .data(dataset)
     .enter()
     .append("text")
     // Add your code below this line

.text((d) => (d[0] + ", " + d[1]))

     // Add your code above this line
</script>
</body>



Your browser information:

User Agent is: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:80.0) Gecko/20100101 Firefox/80.0.

Challenge: Add Labels to Scatter Plot Circles

Link to the challenge:

2 Likes

Hi @amejl172. You are not positioning the text label on the scatter plot. Add the following just after the text attribute:

 .attr("x", (d, i) => d[0] + 5)
 .attr("y", (d, i) => h - d[1])
1 Like

Thank you! :grinning:

2 Likes