Update index.md (#34229)
parent
94508eba89
commit
ec25ccfb32
|
@ -3,8 +3,27 @@ title: Add Labels to Scatter Plot Circles
|
|||
---
|
||||
## Add Labels to Scatter Plot Circles
|
||||
|
||||
This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
|
||||
In this challenge, you are required to set the x attribute so it's 5 units more than the value you used for the cx attribute on the circle. Set the y attribute the same way that's used for the cy value on the circle, for the text element.
|
||||
|
||||
<a href='https://github.com/freecodecamp/guides/blob/master/README.md' target='_blank' rel='nofollow'>This quick style guide will help ensure your pull request gets accepted</a>.
|
||||
### Hint 1
|
||||
|
||||
<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds -->
|
||||
Target the `svg.selectAll("text")` codeblock.
|
||||
|
||||
### Hint 2
|
||||
|
||||
Use `d[0]` and `d[1]` for the data to be displayed.
|
||||
|
||||
### Hint 3
|
||||
|
||||
The format for display has to be `x, y`.
|
||||
|
||||
##### Note
|
||||
There is a space between the comma and the y attribute.
|
||||
|
||||
### Solution
|
||||
|
||||
Since, you need to add the x any y attributes similar to those as they have been set for the circle, add this to the `svg.selectAll("text")` codeblock:
|
||||
|
||||
```javascript
|
||||
.text((d) => (d[0] + ", " + d[1]))
|
||||
```
|
||||
|
|
Loading…
Reference in New Issue