fskpf/svg2roughjs

Support rectangular clipPaths

fskpf opened this issue · 4 comments

fskpf commented

At least simple rect clipPaths should be possible.

Can't we draw into a separate canvas with the clipPaths dimensions and then draw this canvas onto the output canvas?

ygra commented

You can just clip in general, I guess. But the result may not be ideal (e.g. with zigzag fills). Doesn't canvas have a way of clipping to a region?

fskpf commented

https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/clip

This should work. I assume that clipPaths can be defined anywhere in the SVG and referenced by any element as well. So I'd do something similar as for the defs (collect them first and reuse where needed?)

ygra commented

That should work, yeah. I think you can probably generate the clipping region for canvas directly and re-use that. But shapes inside a clip-path may still have an ID that could be referenced in a use, so we must not skip them entirely for normal processing. Although I think we collect the shapes with ID via XPath anyway, so that shouldn't be affected.

I probably won't find time today with family and SpaceX, though ;)

fskpf commented

Added basic support but still needs more work -> #26