Parsing SVG shapes

Programming Questions

lwerber

in Programming Questions • 2 years ago

I am trying to parse an svg shape that i created in illustrator using loadShape, and then get.Child. I want to be able to change the colors of the shapes with in the program. Bu I dont understand how to name a shape. As far as I know, my shapes don't have names for me to call out to get the child. What if there's only one shape in the file and i just want to get that one. i think i am missing a key piece of information.

this is the example they give:

PShape states;
PShape ohio;
states = loadShape("tristate.svg");
ohio = states.getChild("OH");
smooth();
background(0);
shape(states, -48, 5);
ohio.disableStyle();
fill(102, 0, 0);
shape(ohio, -48, 5);

what i don't understand is what is "OH"?
Thank you!

Replies(2)

anchnk

Re: Parsing SVG shapes

2 years ago

SVG is an XML-like file format so easily human readable.
I'd suggest you to open the svg file with a text editor to understand how this is made.

An SVG file can be made of many shapes which have generally a unique ID attribute (like a unique name).
So basically getChild try to find if an SVG element have an attribute id that much the parameter defined in getChild().

In the given exemple, the file is made of several path elements and the one that represent the Ohio State have the id "OH".

If you wanna go deeper with SVG, you can have a look at the specification (not needed to get started with).

lwerber

Re: Parsing SVG shapes

2 years ago

thanks! looking at the svg file as a txt file helped alot!

Top Reply