Add area around mouse SVG path

Question

Is there a way to add an area along the line path in an svg-generated graph?

I want the user to be able to hover next to , and not just above the line in the line chart, and everything happens after mouse hovering.

Currently, with the code that I have, you need to roll the current line. But I want to set the area around the line.

(Adding a pad to the path does not work)

Answer 1

My approach would be to make the second pathon the first, which uses the same data and row functions, but is transparent and has a larger one stroke-width.

mouseover mouseout .

: http://jsfiddle.net/henbox/u0vz96qe/1/

, . ,

.fatpath {
    ...
    opacity:0.1;
}

opacity:0;