Stacked and grouped bar chart

not working

by gayathri ganesh

HTML

<script src="http://mbostock.github.com/d3/d3.js"></script>

CSS

rect{
    fill:skyblue;
    stroke:blue;
}

JavaScript

//var data = d3.range(2).map(function(){return d3.range(3).map(Math.random)}),
var data = [[0.1, 0.2, 0.3, 0.4], [0.5, 0.6, 0.7, 10]],
    chartW = 300, 
    chartH = 200, 
    margin = [10, 10, 10, 10], 
    gap = 10;

var dataForStack = data.map(function(d, i){return d.map(function(d2, i2){return {x: i2, y: d2};});});

var stackedData = d3.layout.stack().offset('zero')(dataForStack); //silhouette, wiggle, expand, zero

//var dataTmp = d3.transpose(stackedData);
var dataTmp = stackedData;
//console.log(dataTmp);

//var barChart = computeBarchart(dataTmp, 0, 0, chartW, chartH, margin, gap);
var barChart = computeStackedBarchart(dataTmp, 0, 0, chartW, chartH, margin, gap);
                                      
var groups = d3.select("body")
    .append("svg")
    .attr("width", chartW+20)
    .attr("height", chartH+20)
    .selectAll("g")
    .data(dataTmp);

groups.enter().append("g")
    .each(function(pD, pI){
            
        d3.select(this).selectAll("rect")
            .data(pD)
            .enter().append("rect")
            //.each(function(d, i){console.log(d, i, pD, pI)})
            .attr("width", function(d, i){return barChart.w(pD, pI, d, i);})
            .attr("height", function(d, i){return barChart.h(pD, pI, d, i);})
            .attr("x", function(d, i){return barChart.x(pD, pI, d, i);})
            .attr("y", function(d, i){
                console.log(d.y, d.y0);
                return barChart.y(pD, pI, d, i);});
    });
  
/*===========================================================*/
    
function computeStackedBarchart(data, chartX, chartY, chartW, chartH, margin, gap){
    var dataValues = data.map(function(d){
            return d.map(function(d){return d.y;});
    });
    //var columnSum = dataValues.map(function(d){return d3.sum(d);});
    var columnMean = dataValues.map(function(d){return d3.mean(d);});
    //var highestColumnSum = d3.max(columnSum);
    var highestColumnMean = d3.max(columnMean);
    var yScale =...