Currently, we can only see the lower-right quarter of the pie graph. This is because the pie starts at (0,0), but we can move the group element containing the pie by adjusting our d3.select('svg') code, as follows:
d3.select('svg') .attr('width', WIDTH) .attr('height', HEIGHT);var container = d3.select('g') //add this line and the next: .attr('transform', 'translate(' + (WIDTH / 2) + ',' + (HEIGHT / 2) + ')'); //add this lineThe pie graph now looks as follows:
Get D3.js Quick Start Guide now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
Get Mark Richards’s Software Architecture Patterns ebook to better understand how to design components—and how they should interact.
Dive in for free with a 10-day trial of the O’Reilly learning platform—then explore all the other resources our members count on to build skills and solve problems every day.
Start your free trial Become a member now