jquery svg - Dashtype line in svg path -


i want create dash type line in svg using path. how can apply dash style svg path make dashed line. please refer below svg.

<path id="container_svg_john_0" fill="none" stroke-width="3" stroke="url(#container_svg_john0gradient)" stroke-linecap="butt" stroke-linejoin="round" d="m 0 -17.25 l 21.633333333333333 -112.12499999999999 m 21.633333333333333 -112.12499999999999 l 43.266666666666666 -51.75 m 43.266666666666666 -51.75 l 86.53333333333333 -25.875 m 86.53333333333333 -25.875 l 108.16666666666666 -155.25 "></path> 

thanks,

siva

you looking stroke-dasharray property:

<path    id="container_svg_john_0"    fill="none"    stroke-width="3"    stroke="url(#container_svg_john0gradient)"    stroke-linecap="butt"    stroke-linejoin="round"    stroke-dasharray="10,10"   d="m 0 -17.25 l 21.633333333333333 -112.12499999999999 m 21.633333333333333 -112.12499999999999 l 43.266666666666666 -51.75 m 43.266666666666666 -51.75 l 86.53333333333333 -25.875 m 86.53333333333333 -25.875 l 108.16666666666666 -155.25 "></path> 

it takes comma separated value represents solid,void. interesting side note: if have odd number of values in array, when goes repeat, pattern reversed, i.e first value void, second solid.

stroke-dasharray="10,5,10" same stroke-dasharray="10,5,10,10,5,10"


Comments

Popular posts from this blog

java - Jmockit String final length method mocking Issue -

asp.net - Razor Page Hosted on IIS 6 Fails Every Morning -

c++ - wxwidget compiling on windows command prompt -