Jump to content
Search Community

How to use Draw SVG Plugin

Tamas test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I have simple question. 

 

When I going to use the Draw SVG Plugin does it work like, that I have a svg illustration and I drag it into the plugin and the plugin will create the path code and animation as well? 

The plugin automatically convert the svg into js path codes?

So I don't need to write the illustration lines in js? 

 

I'm quite beginner so hope it's clear what is my question!

Thanks in advance for all advice

 

Link to comment
Share on other sites

Hi Tamas  :)

 

there isn't any conversion , as you can read in DOCs. :

 

DrawSVGPlugin allows you to progressively reveal (or hide) the stroke of an SVG <path>, <line>, <polyline>, <polygon>, <rect>, or <ellipse> and you can even animate outward from the center of the stroke (or any position/segment). It does this by controlling the stroke-dashoffset and stroke-dasharray CSS properties :  http://www.w3schools.com/svg/svg_stroking.asp

 

 pls check these out :

 

- i think this article worth to read for you :  http://css-tricks.com/using-svg/

 

DrawSVG Doc. + video tutorial : http://greensock.com/docs/#/HTML5/Plugins/DrawSVGPlugin/

 

- you can find DrawSVG plugin starting codepens here : http://codepen.io/collection/DYmKKD/

 

- and don't forget that DrawSVGPlugin is a bonus plugin for all Club GreenSock membershttp://greensock.com/club/

  • Like 3
Link to comment
Share on other sites

Hi Diaco.AW,

 

thank you for making clear my dilemma, you answered exactly what I was looking for!

I going to try the plugin.

If I will need other future help in mater of using the DrawSVGplugin, I will write here if you don't mind.

 

Cheers

Tamas

Link to comment
Share on other sites

  • 2 years later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...