[Creating a layer of gradient within an SVG path dynamically]

0down votefavorite

 

I am creating a dynamic path using my SVG. I now wish to add gradient to my path but I am stuck. The way I am trying, my gradient is coming along the path as shown in image 2 while I require it to be the kind in image 1. Needed_Picture Current_Picture

My gradient and stroke definitions are as follows :

</svg>

script :

               ` svgPath.setAttribute("stroke-width", "10");            });`

 

0down votefavorite

 

I am creating a dynamic path using my SVG. I now wish to add gradient to my path but I am stuck. The way I am trying, my gradient is coming along the path as shown in image 2 while I require it to be the kind in the image named as Current.

My gradient and stroke definitions are as follows :

</svg>

script :

               ` svgPath.setAttribute("stroke-width", "10");            });`

[drawing an svg path with the mouse]

Hey! Did you succeed? I have a similar problem where I want to draw a SVG path with lines with the help of the movements of my mouse and I am kinda stuck here. Have gone through Pen too and browsing stuff to see if I can use anything similar. I want a path to be dynamically created as and when the mouse moves.