score:1

Accepted answer

I asked Irene Ros, who helps run d3.chart, and she informed me that the problem is that d3.chart's draw method can only take an array or a data object- it cannot take a function. She gave me a few helpful hints for ways to get around this: by using a transform function to edit my data within the chart, rather than using a function, or by creating a chart that holds multiple charts (see https://gist.github.com/jugglinmike/6004102 for a great example of this).

However in the end I found the simplest solution for me was to manually set the data. It feels like a bit off a hack because D3 does this for you already, but it was much simpler than changing the whole set up of my chart, and allows for nested data (yay!).

var svg = d3.select("body")
  .selectAll("svg")
  .data(data)
  .enter()
  .append("svg");

svg.each(function(d, i) {
  var chart = d3.select(this)
    .chart("Circles")
    .height(50)
    .width(100)
    .radius(5)
  var data = d.values;
  chart.draw(data);
});

Related Query

More Query from same tag