Extract paths from SVG files to draw in of

resources
1

Hi all, from Colombia.

I made a little script that parses a SVG file to extract the information about the paths and converts it to functions to put in OF draw() method. The script is still buggy, but works for many cases of bezier draws of inkscape. I’m working to provide options like insert varibles to move the drawing in the screen.

I think that this could be useful for someone. The link to download the script
http://iner.udea.edu.co/~brolin

To run the script, you must have ruby installed and a SVG file with the drawing’s path

  
 $ ./svgpath2of.rb File.svg

I’m waiting for comments.

Thanks.

2

Some images to clarify the topic

The drawing in Inkscape.

Running the script with the drawing above as argument.

The result in OF.

3

Hi,

I tried your script…it worked on your .svg file but didn’t complete the coordinates on mine (almost worked but I think it encountered some parsing error):

  
  
ofBeginShape();  
ofVertex( 40.346081,52.505563 );  
ofVertex( 32.296081,52.505563 );  
ofVertex( 32.296081,44.454313 );  
ofVertex( 40.346081,44.454313 );  
ofVertex( 40.346081,52.505563 );  
ofEndShape();  
ofBeginShape();  
ofVertex( 32.295831,44.453593 );  
ofVertex( 35.237081,41.512343 );  
ofVertex( 43.285831,41.512343 );  
ofVertex( 40.345831,44.453593  
ofBeginShape();  
ofVertex( 40.346331,52.463843 );  
ofVertex( 43.286331,49.521343 );  
ofVertex( 43.286331,41.512593

As you can see it didn’t finish the last shape.

Can you have a look at my file? Maybe there’s a bug in the script.
http://www.digitalstar.net/openframeworks/box.svg

Thanks!

4

wow nice men congratulations :slight_smile:

5

Hello,

Thanks for check this ugly script ;D, i made a change and now works with box.svg and kv.svg. Really i don’t know if it is the better way. I don’t know what general is, but sometimes works.

best regards.

brolin

6

Hi brolin

I came across your post cos I would like to extract the paths of some SVG files to OF format,
but somehow your script keeps working only with the sample .svg you provided…

I create the SVGs using Illustrator 4.0. What could go wrong?

By the way:
Is it possible to also extract polygon information as ofVertex? (it should be even more straightforward but since I don’t know how to use ruby I prefer to ask u :wink:

Thx in advance
ninka

7

I have an svg importer addon in the works I can upload it after this weekend.
It will come with a bunch of parsing bugs though - the svg spec is pretty nuts!
:smiley:

8

hey theo that would be great if u upload it!
thx in advance and take care
ninka

9

Here it is - very rough for now - no example app and probably a little buggy.

It was mainly done to load paths, but it also can do lines, circles, rects, polygons.
Currently doesn’t do multiple contours in one path and if you have your element in groups it will totally break. These are not tricky things to fix but just didn’t have time to add more than what I needed.

Shapes can draw themselves and there is also a svgShapeInterpretur class that turns paths and curves into resampled straightline points (similar to how OF draws curves)

Hope it is helpful :slight_smile:

Theo

ofxSvgLoader.zip

10

Thx a lot Theo
That would make creative coders illustrators o vice verca ;)) maybe
I will give it a try now!
Saludos
Ninka

11

oh also no color or fill data right now too :smiley:
but the format is quite clear and quite poweful so I think it could become quite a good addition to OF.

It has been a lot of fun to play with already!
Theo

12

Thanks Theo!!

13

Hey Theo

Sorry I could not manage to post that earlier - but I think the svgLoader has a small issue with lines:
if there is a svg shape which contains only two pts - for example a line you correctly detect it but than the drawing fails since ofVertex needs at least 3 pts, I am correct?

Thx a lot for the contribution anyway, it just saved my ass in a small project :wink:

saludos
ninka