Jump to content
  • Advertisement
Sign in to follow this  
  • entries
  • comments
  • views


Sign in to follow this  



This weekend I had an itch that I needed to scratch. I have sporadically been working on a project that uses SVG and javascript. I kept coming up against two problems: (1) getting a reliable bounding box around an SVG path, and (2) being able to properly align SVG paths with one another.

There are other solutions to finding the bounding box of an SVG path. Popular solutions are using the functionality of the SVG API itself, or using the awesome RaphaelJS library.

The SVG API is not pleasant to work with and, from what I understand, focuses more on operating at the level of the SVG node itself (what I would consider the root of the scene graph). I am more interested in working with the paths and composing objects from sets of paths. So, for the bounding information this is a little awkward, but it is really the alignment information that is unavailable. In particular, when you have an anchor point on a shape that is not in the middle or at the edges, it gets fiddly. I don't like fiddly. Especially, when I am working with things like Bezier curves that are really quite nice to work with. The information about the inflection points is really useful for what I am doing.

RaphaeJS is an awesome library but sometimes you just want to a solution to one particular problem. Since I was not intending to use RaphaelJS for anything else, just importing it to calculate a bounding box seemed wasteful.

And finally, I just wanted to solve it! :-) I love this kind of problem so I had a hard time not doing it.

The code is free and open and I hope some of you reading this may find it useful.


Sign in to follow this  

1 Comment

Recommended Comments

I remember when I used to include the whole Boost library exactly as downloaded in my projects, just to use some threading.


Sometimes it is better to simply solve things for oneself!

Share this comment

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Advertisement

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!