Closing the Flex SVG Loop

Here is how my Shapes and Strokes creation looks like in Flex SVG Explorer (second sample in the Load SVG File dropdown):


Obviously some strokes got lost in translation there, but I am still very happy with the outcome considering my initial goals for the two prototypes.

What does it all mean?

Basically, it means that by using two different Flex SVG libraries (SVG Viewer API and Degrafa) I’ve closed the full cycle SVG manipulation loop in Flex:

1) Create new SVG-based graphic with Degrafa SVG Painter and export it to SVG markup;

2) Load the created SVG document in Flex SVG Explorer using SVG Viewer API for further inspection and manipulation.

Now I can take a little breather, wait for the two libraries to improve, and slowly work on adding shape templates, object handles and other tools for creating and editing of SVG graphics in Flex.

Perhaps I should combine the two tools into one, or just wait till SVG to Degrafa converter and API comes out. Then I could just stick with Degrafa for loading and manipulating SVG. Some utility classes or toString methods to get SVG element markup of Degrafa objects would be nice too . Maybe I’ve missed it in the current codebase.

7 Responses to “Closing the Flex SVG Loop”

  1. Taras

    You can now view the Flex SVG Explorer shell source code at:

    Just right click and View Source :)

  2. Pedro Sacramento

    Great work! Another cool feature would be make objects visible/invisible at the svgtree.
    best regards

  3. Taras

    yeah… I was planning to integrate ObjectHandles for selecting svg elements on canvas and updating their attributes.

  4. Taras

    You can find the updated v. of Flex SVG Explorer here:

    It is now using the latest svgweb AS API from

    Check out new SVG examples rendered with new and improved svgviewer AS api from the Sample SVG combo box.

  5. peter

    Hi Taras,

    Great work.

    Is it possible for you to post the source code for mini Shape Designer (v. 0.2) ?


  6. Anne

    This is great stuff! One question about it:
    In version 0.4 the user is able to select each SVGNode by a click and the selection is reflected in the textarea and in the tree. But I cannot find this in the source code (downloading gets me a version 0.3, though).
    Could you provide the source code for version 0.4 (or newer, if available) – I’d like to learn more about it.

    Thanx in advance – Anne

  7. Anne

    Sorry, I got it too late: after trying the link from comment of July 31, I got the new version source code.

    Thank you very much

Leave a Reply