RobinBerjon

Canvas-SVG Bridge

It All Works Together

Tech, Essay |

But why, man, why? Well, there are quite a few scripts and libraries out there that do really nice things using <canvas>, and that's perfectly fine. But now and then I've been finding myself wanting to get at the output of those libraries in order to simply include it as is somewhere, or perhaps toy with it. After all, if the big bonus with canvas is that it is fast and requires very little memory, the corresponding downside is that you can't manipulate what's drawn on it as it forgets everything it just did.

There was of course the option, every time I saw something neat in canvas, to just do a one by one port to SVG. But what kind of fun would that be? Canvas and SVG have a lot in common, and there should be an easy way to translate from canvas to SVG. Especially since it's been done for VML already.

So here goes. It's a one-day piece of code, so not amazingly well written and the whole code and documentation are to be found in its Hacks page.

Share and Enjoy, and send me feedback.