Box2D Forums

Hey all,

Thanks to Shaktool here at the forums, I've written up a couple tutorials on making levels in Box2D using InkScape and updated the parser to support Bezier curves. You can now import curves directly into the Box2D engine for your levels and even specify the # of segments for all curves either through a default value or through line-width.

The first tutorial uses the outdated parser, but explains level creation and floors/ceilings in InkScape.
http://www.ezqueststudios.com/blog/creating-levels-box2d/

The second tutorial uses the new parser and explains the values you pass to the parsing function.
http://www.ezqueststudios.com/blog/box2d-svg-parser-curves/

Both of these tutorials have copy-paste code, examples, pictures, and source files.


Shaktool also said he's also cleaning up the code and (is uploading it to the Box2DFlash SVN) *has agreed to upload it to the Box2DFlash SVN. Many kudos to him for his help.

I said I'm cleaning up the SVG parser. And I will certainly release it somewhere, probably here in this thread, maybe tonight. I suppose it would make sense to update the EdgeChain testbed example, though, so yeah, I'll probably do that.

Thanks for tutorials and the bezier port!

Here is a better SVG parser. (I didn't change the Bezier Curve generator.)

It now supports "relative" commands, and paths with multiple sub-paths. I'd say that the parser is now around 35% of the way towards being a good, general SVG parser. Some desirable features that it is still missing include:
-quadratic bezier curves (as opposed to the more common cubic bezier curves)
-elliptical arcs
-transformation matrices
-non-path primitives, like circles and rectangles
-the ability to use filled regions to determine which side of the edges should be solid, rather than relying on the more finicky winding direction.

After seeing how much you've updated the parser, I'm don't think I can take much credit for its improvement.

Do you want me to update the tutorial and source code on my site with the latest version or link back to here?

*shrug* It's up to you.

I just felt that the old parser was inappropriate for more complex shapes, but it looks like it's catching on so I had better refactor it before it becomes a bloated mess of spaghetti patches.

Alright, I linked back to this thread in case I ever start updating it and updated the post/source. I modified 5 lines of code so that parseSVG would return a reference array of all of the shapes created in the Box2D world in case anyone wants to delete the parsed shapes.

So sorry to be out of the loop

Although the SVG parser now may support curves? I thought that box2d didnt have a curved surface (i thought boris's old class was the best shot at this)?

Do you mean simulating a curve by using lines?

Yes.

I really like the SVG-parser. It makes things real easy

After i got it working i wanted to make sensors with it.
So i changed the following in the b2SVG.as :

into:


It's working like a charm and it's funny to see that concave shapes are only partly sensor.

I hope i don't look like a complete newbie for sharing this with you, but i was real happy with it to have it figured out.

Now i want to ask: Why did you use the b2EdgeChain to begin with?

I have added a bit of code for reading files from Illustrator (CS2 is what I've got here). Since - at least my version - exports the style a little different. This patch allows to read the stroke-width attribute instead of the style attribute (and I have added a bit of code to parse circle definitions, though I am not sure it is the right way to do so).

Cheers for the parser!