Search code examples
d3.jsnanpathelement

NaN-Error at d3js error bars

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"?

Solution

  • 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);
    })