D3: Create A Grouped Bar Chart From Json Objects

I have some data like this: [ { id: 12, value1: '2.92', value2: '4.22', value3: '3.69' } , { id: 23, value1: '2.69', value2: '4.24', value3: '3.77' } , .... ] I want to creat

Solution 1:

First, supply or convert the data to an ordinary array or arrays eg

data = [ [ 2.92, 4.22, 3.69], [2.69, 4.24, 3.77] ]

Now you can use d3.transpose to pivot the data so you get

var tdata = d3.transpose(data);

gives you

[ [2.92, 2.69], [4.22, 4.24], [3.69, 3.77]]

then here is a group bar from iaindillingham to use as a model (I've fixed his version to use the latest d3 library). See it working here: http://bl.ocks.org/3532324