1

I'm trying to create a path animation using an svg and a jQuery plugin called Vivus that helps create animated svgs. The problem I'm having is that my path is dashed and since it's only one path, when the script is ran, it connects it in a straight line. I tried creating each dashed line manually but it doesn't look great. My question is, is there a way to make a dashed path and then divide each dashed line into its own path? Or what other way can I achieve this?

Here's the kind of path I'm talking about: Path

John Slegers
  • 45,213
  • 22
  • 199
  • 169
Buzzer
  • 51
  • 8

1 Answers1

2

Draw a small line segment and drag it into the brushes panel. When it pops up, choose pattern brush. Change the spacing percentage (play with values until something works). Then, go draw a line and set the brush to be the pattern you just made. Now go and choose Object -> Expand Appearance and you'll get little lines instead of shapes.

Jordan Soltman
  • 3,795
  • 17
  • 31
  • Thanks! Saved me a lot of time. Not exactly what I was looking for since I need only a line path – each it's own line path – and this made the dashed lines into it's own shape. This saved me loads of time either way! Once again, thanks. – Buzzer Nov 25 '15 at 21:52
  • I will try that and see how it goes. Thanks! – Buzzer Nov 26 '15 at 21:32