RaphaelJS library to find intersections of paths

Question

I'd like to draw shapes which are intersections of circles using RaphaëlJS. Is there a library out there to do that already? A more general SVG path library would probably work too, but my google foo is failing me.

I'd like to draw shapes like these:

Answer 1

SVG Compositing spec describes compositing operations (comp-op property), but they're not currently supported by any browser.

Here's an example you can try, but as of writing this it doesn't work in Chrome or Firefox. Clipping can work in some cases, but it doesn't allow to do the knock out effect.

On the other hand, canvas compositing operations are fully supported, so you can try using canvas for your game.