D3.js stacked Barchart Error - d3.js

Question

I Need your help... why is this Chart not running.. Error in Console (d3.v2.js Zeile 2396):
TypeError: string.substring is not a function
var n = d3_time_numberRe.exec(string.substring(i, i + 2));
Could anybody help me please?
<script type="text/javascript">
var w = 960,
h = 500,
p = [20, 50, 30, 20],
x = d3.scale.ordinal().rangeRoundBands([0, w - p[1] - p[3]]),
y = d3.scale.linear().range([0, h - p[0] - p[2]]),
z = d3.scale.ordinal().range(["lightpink", "darkgray", "lightblue"]),
parse = d3.time.format("%m/%Y").parse,
format = d3.time.format("%b");
var data = [
[
new Date('1991-01-18T00:00:00'),
52.380001068115234,
28.56999969482422,
10.0
],
[
new Date('1994-11-17T00:00:00'),
57.88999938964844,
21.049999237060547,
10.0
]
];
var svg = d3.select("body").append("svg:svg")
.attr("width", w)
.attr("height", h)
.append("svg:g")
.attr("transform", "translate(" + p[3] + "," + (h - p[2]) + ")");
// Transpose the data into layers by cause.
var causes = d3.layout.stack()([data[1], data[2], data[3]].map(function(cause) {
return data.map(function(d) {
return {x: parse(d[0]), y: +d[cause]};
});
}));
// Compute the x-domain (by date) and y-domain (by top).
x.domain(causes[0].map(function(d) { return d.x; }));
y.domain([0, d3.max(causes[causes.length - 1], function(d) { return d.y0 + d.y; })]);
// Add a group for each cause.
var cause = svg.selectAll("g.cause")
.data(causes)
.enter().append("svg:g")
.attr("class", "cause")
.style("fill", function(d, i) { return z(i); })
.style("stroke", function(d, i) { return d3.rgb(z(i)).darker(); });
// Add a rect for each date.
var rect = cause.selectAll("rect")
.data(Object)
.enter().append("svg:rect")
.attr("x", function(d) { return x(d.x); })
.attr("y", function(d) { return -y(d.y0) - y(d.y); })
.attr("height", function(d) { return y(d.y); })
.attr("width", x.rangeBand());
// Add a label per date.
var label = svg.selectAll("text")
.data(x.domain())
.enter().append("svg:text")
.attr("x", function(d) { return x(d) + x.rangeBand() / 2; })
.attr("y", 6)
.attr("text-anchor", "middle")
.attr("dy", ".71em")
.text(format);
// Add y-axis rules.
var rule = svg.selectAll("g.rule")
.data(y.ticks(5))
.enter().append("svg:g")
.attr("class", "rule")
.attr("transform", function(d) { return "translate(0," + -y(d) + ")"; });
rule.append("svg:line")
.attr("x2", w - p[1] - p[3])
.style("stroke", function(d) { return d ? "#fff" : "#000"; })
.style("stroke-opacity", function(d) { return d ? .7 : null; });
rule.append("svg:text")
.attr("x", w - p[1] - p[3] + 6)
.attr("dy", ".35em")
.text(d3.format(",d"));
</script>

Answer 1

The problem is here:
var causes = d3.layout.stack()([data[1], data[2], data[3]].map(function(cause) {
return data.map(function(d) {
return {x: parse(d[0]), y: +d[cause]};
});
}));
d[0] is already a date object - new Date('1991-01-18T00:00:00') - and parse is expecting a string.
Instead, pass d[0] directly:
return {x: d[0], y: +d[cause]};
Sidenote: check out the debugging tools for chrome. Most of the error messages you get working with d3 will not give very useful messages (like "TypeError: string.substring is not a function") and being able to look through the stack is extremely helpful.