DrawSVG: Animate Stroke

Sophisticated SVG drawings can created by means of animating the stroke on an element. It uses files: TweenMax.min.js, DrawSVGPlugin.min.js
This is a basic example.
DrawSVG can progressively reveal (or hide) the stroke of an SVG <path>, <line>, <polyline>, <polygon>, <rect>, or <ellipse>. It does this by controlling the stroke-dashoffset and stroke-dasharray CSS properties. You can animate the stroke in both directions. Value units can be % and/or pixels(default).

value="stroke-dashoffset stroke-dasharray"

Method:

SVG Source:
Javascript: