javascript - Using d3 to shade area between two lines -
so have chart plotting traffic vs. date , rate vs. date. i'm trying shade area between 2 lines. however, want shade different color depending on line higher. following works without last requirement: var area = d3.svg.area() .x0(function(d) { return x(d3.time.format("%m/%d/%y").parse(d.original.date)); }) .x1(function(d) { return x(d3.time.format("%m/%d/%y").parse(d.original.date)); }) .y0(function(d) { return y(parseint(d.original.traffic)); }) .y1(function(d) { return y(parseint(d.original.rate)); }) however, adding last requirement, tried use defined(): .defined(function(d){ return parseint(d.original.traffic) >= parseint(d.original.rate); }) now works, except when lines cross. how shade area under 1 line between points? it's shading based on points , want shade based on line. if don't have 2 consecutive points on 1 side of line, don't shading @ all. since don't have datapoints @ intersections, sim...