Alright Guys, I have a little challenge / question for you.

    I really want to be able to get SVG path d attribute data into a format that BezierPlugin can use.

    So given this string M0,0c0,0,14,184,157,184V86h173c0,0,105-3,105,93, I’d want either

    an array of all the x/y values of all the anchor and control points like

    [0,0,0,0,14,184,157,184,157,184,157,86,157,86,157,86,330,86,330,86,330,86,435,83,435,179]

    or an array of point objects (which ultimately would get passed to BezierPlugin)

    [{x:0, y:0},{x:0, y:0},{x:14, y:184},{x:157, y:184},{x:157, y:184},{x:157, y:86},{x:157, y:86},{x:157, y:86},{x:330, y:86},{x:330, y:86},{x:330, y:86},{x:435, y:83},{x:435, y:179}]

    The end goal is draw a continuous path in Illustrator, smack svg output into an html page, use the svg path for a Bezier tween.

    This video explains all this in glorious detail:

    Does raphael, or snapSVG or any other library offer a convenient conversion method?

    It seems that since the same curves can be represented each way it should be easy to convert 1 format to the other, right?

    I’m not looking to have a robust tool built that analyzes svgs and builds animations automatically, just a function that I can do

    convertPath(dPath) { … //turn dPath string into an Array of anchor and control points return BezierPointData } //usage var bezierAnchorAndControlPoints \= convertPath(“M0,0c0,0,14,184,157,184V86h173c0,0,105-3,105,93”);

    Any help is greatly appreciated.

    Carl

    p.s: This mission was greatly inspired by Chris Gannon’s DrawScript converter: http://gannon.tv/drawscript-to-gsap/ and I’d like to publicly thank Rodrigo for helping me get a good leap into Raphael.
    https://greensock.com/forums/topic/10688-challenge-convert-svg-path-to-bezier-anchor-and-control-points/