drawSVG, trying to make something simple but nothing happen

[blippar]

Hi !

 

It's me again..

 

Now I am trying to draw a SVG from what a designer gave me.

 

But, I tried something very simple from the video and as you will see in the codepen, nothing happen...

 

I don't know why, can someone help ?

See the Pen mebdmB by anon (@anon) on CodePen.

[Carl]

thanks for the demo. You just need to be sure the path has some stroke attributes that define color, width etc

 

http://codepen.io/GreenSock/pen/KdPKZY

[blippar]

Aww awesome, I didn't now ! Thank you very much Carl.

[blippar]

Just one more question :

 

is it possible to really "draw" the svg ? I mean. This is a drop about to fall, it is possible to draw the curve then the line then bottom ?

 

Or do you expect too much from svg animation haha ? cuze I saw that a lot of time dev played only with the size of the svg..

[Carl]

Sorry, I'm not really understanding your followup question.

 

DrawSVGPlugin allows you to control how any stroke on an SVG element is revealed. No more, no less.

 

With our timeline tools you can create many tweens that use DrawSVG to animate multiple paths and schedule them to run at any time in any order.

 

http://codepen.io/GreenSock/pen/jEEoyw

http://codepen.io/GreenSock/pen/BNBYrg

 

Perhaps you can rephrase your question or provide some sort of visualization / demo.

[Rodrigo]

If I understood correctly you want something like this?:

 

http://giphy.com/gifs/water-drop-YDH4R2UFc14uk

 

If so you need to modify the SVG paths and the Draw SVG Plugin just works on a defined path not a dynamic one. That is a different story as you can see in this codepen by Elliot:

 

See the Pen AkBre by pyrografix (@pyrografix) on CodePen.