NaN-Error at d3js error bars

Question

Here is the important part of my code. For some reasons, there is a problem with the "errorBars2". It always returns this error:

Invalid value for <path> attribute d="M40.5,NaNL40.5,NaNZ"

I spent now hours on searching for the mistake but I can't find it! Could somebody explain me what's the problem with the "errorBars2"?

Answer 1

In errorBarArea2 you have written for

.y0(function (d) {
        return y0(+d.top_after + +d.moe3);
    })

but in the JSON structure it is not available change it to +d.moe3_after

and you have written

.y1(function (d) {
return y0(+d.low_after - +d.moe4);
})

but in the JSON structure it is not available change it to +d.moe4_after

So the final code is

var errorBarArea2 = d3.svg.area()
    .x(function (d) {
        return x3(d.name) +x3.rangeBand()/2;
    })
    .y0(function (d) {
        return y0(+d.top_after + +d.moe3_after);
    })
    .y1(function (d) {
        return y0(+d.low_after - +d.moe4_after);
    })

Answer 2

Tell me if this works.

var errorBarArea2 = d3.svg.area()
    .x(function (d) {
        return x3(d.name) +x3.rangeBand()/2;
    })
    .y0(function (d) {
        return y2(d.top_after + +d.moe3);
    })
    .y1(function (d) {
        return y2(d.low_after - +d.moe4);
    })