Binary operations on SVG objects

[paulbrzeski]

I couldn't find a way to do binary operations on SVG objects in Fabric. I want to be able to perform operations like add/subtract between a circle and a square.

Example in Paper.JS: http://paperjs.org/examples/boolean-operations/
Implementation in Adobe Illustrator - https://cdn.tutsplus.com/vector/uploads/legacy/tuts/232_Comprehensive_Pathfinder/00_Panel.jpg

Has anyone implemented functionality like this in Fabric.JS and/or would anyone be interested in developing it? I'm currently looking into loading up Paper.JS in my application alongside Fabric just to do the operations but if someone has a suggestion I'll take it :)

Apologies if this has been posted before but I couldn't an example of this anywhere.

[asturur]

Definitely that is a feature we want to have for paths.
It would probably works on path only ( no circle, no rect unless they get converted to paths )

[melchiar]

I second this as a great feature addition! For now though, you can always use Maker JS as a supporting library since it can perform all of the common boolean operations on path data. It can be a bit slow and buggy though, so certainly a native solution would be preferable.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[Baoyuantop]

Is there a better solution to this problem now?

[asturur]

No. I would not mind having that logic in fabric.util.intersectPath(pathA, pathB) and similar.

[NaveenEdala]

Any way to do this yet? I am still struggling to reliably do this with globalCompositeOperations and such!

[asturur]

You could check what paperJS is doing and just implement theyr function or try to use it on our paths