As noted in my comment, your problem is because d3.csv
acts asynchronously, and input_data
isn't populated when d3pie
tries to create your chart.
There is something highly suspicious going on with input_data
in the other examples -- it should be called for every item in data
, but seems only to be called once. Rather than using input_data
to collate intermediate results, it's much easier to use javascript's map
function to transform your csv data into the format you want:
d3.csv("data.csv", function (data) { var pie = new d3pie("pie", { header: { title: { text: "Simple Pie", fontSize: 30 } }, data: { content: data.map( function(d){ return { label: d['First'], value: +d['Age'] } }) } });});
map
iterates over an array and produces an array as output, so it's much cleaner and easier than creating extra arrays on to which you push data, etc.