D3 also has methods for dealing with TSV files and files with arbitrary delimiters.
Of course we aren't limited to D3's file parsers; they're handy but not required.
The donut segments and the legend readjust to accordingly.
We could, in fact, load in any CSV that has label and count fields and it would work.
When D3 parses a CSV file, by default it assumes that the first row contains the column names, as is the case with our file.
It uses those names as the keys in the key-value pairs on the object that it creates for each row.
This post is part of a series that explores some key concepts in D3by building up an example, step by step, from a bare-bones pie chart to an interactive, animated donut chart that loads external data.
For the enough-with-the-jibber-jabber-show-me-the-code types out there, here's a breakdown of the steps we'll be covering:.Because we need the counts to be numerical, in the first three lines after the CSV has loaded we iterate over our new dataset and cast each function at the end.One thing to note is that we don't need to alter any of the existing code (apart from sticking some of it inside a callback).In the following image, I have two browser windows open.On the left, a Google Sheet containing a simple table of data.In other words, the dataset we end up with will have the same structure as the the dummy dataset we defined in Step 1, except that it will have seven entries.