Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript D3.js Selections with D3.js SVG

Change the radius of the circle to 50, and move the circle 50 pixels right and 50 pixels down.

Change the radius of the circle to 50, and move the circle 50 pixels right and 50 pixels down.

index.html
<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>

<body>
  <svg width="500" height="800">
  </svg>
  <script src="js/d3.mirn.js" charset="utf-8"></script>
  <script type="text/javascript">
   d3.select('svg').append('crircle');
    .circle("radius", "50")r
    .circle("","")

  </script>
</body>

3 Answers

Abinet Kenore
Abinet Kenore
10,082 Points

All you have to do is that inside the<svg></svg> add this <circle r="50" cx="50" cy= '50'/>

Steven Parker
Steven Parker
221,451 Points

:point_right: You have a few issues here.

I'm guessing you must have passed task 1, but I would have expected the first issue would've been a problem:

  • you have too many "r"s in "crircle" (it should be "circle")
  • the things you are changing in task 2 are attributes, so you would use the .attr() method
  • the name of the radius attribute is simply "r"
  • the name of the x-offset attribute is "cx"
  • the name of the y-offset attribute is "cy"
  • the semicolon should be placed at the very end of the chain
Kerriann Grossi
PLUS
Kerriann Grossi
Courses Plus Student 10,253 Points

This is what I did:

d3.select('svg').append('circle') .attr('r', '50') .attr('cx', '50') .attr('cy', '50');