paperjs / paper.js

The Swiss Army Knife of Vector Graphics Scripting – Scriptographer ported to JavaScript and the browser, using HTML5 Canvas. Created by @lehni & @puckey

http://paperjs.org

Other

14.45k stars 1.22k forks source link

Specific boolean intersection case fail since v0.10.4 #1619

Closed sasensi closed 5 years ago

sasensi commented 5 years ago

Description/Steps to reproduce

Do boolean intersection between 2 specific shapes.

Link to reproduction test-case

The bug is reproduced in this sketch.

Expected result

screenshot-sketch paperjs org-2018 11 29-10-00-55

Actual result

screenshot-sketch paperjs org-2018 11 29-10-54-37

Additional information

This bug only shows up in versions 0.10.4 and later. It was originally reported here.

lehni commented 5 years ago

The way boolean operations are currently implemented, unfortunately there will likely always be some edge cases that fail. @hkrish has some good ideas about a better approach to boolean operations, but implementing it in paper.js is far from trivial. I am very reluctant to spending more time on ironing out kinks in edge cases, but maybe @iconexperience could take a look? He helped a lot with the past iterations of improvements...

sasensi commented 5 years ago

I've read passed discussion about boolean operations but I didn't get far enough to understand how they are implemented in detail. Have somebody already considered porting Inkscape implementation (https://gitlab.com/inkscape/inkscape) which seems to be working well ? I had a quick look at it but I don't know much about C++ so I can't estimate how much work this would be.

lehni commented 5 years ago

I've looked at InkScape in the past, but I think the code is rather massive... Size is a concern here too. Not sure what's best to do at this point, as we've progressed pretty far with the current approach. It just feels like edge cases don't stop to pop up!

hkrish commented 5 years ago

Is it such a crazy idea to deprecate boolean ops altogether within the core library, and inherit from some thing like https://skia.org/user/modules/pathkit?

lehni commented 5 years ago

Oh wow, I wasn't aware of this! Not such a crazy idea, but the asm.js is almost twice the size of the whole paper.js library, and the wasm version is about the same size... I guess outsourcing would make sense though. @hkrish did you test it? Is it good? I remember Skia's boolean ops having some glitches and side-effects in the early days?

hkrish commented 5 years ago

It is quite a large library for sure (gzipped download size, for wasm seems to be comparable to paperjs, was it ~130K?). I haven't tried it yet, so no idea on glitches or accuracy. It seems they have been working on it though --https://skia.org/dev/present/pathops. Also they have a "canvaskit" pending release which is a canvas based implementation of whole skia?! It all depends on what will people use paperjs for, for building interactive editors and such, this might not be a bad idea.

sasensi commented 5 years ago

I've set up a little fiddle running Skia and Paper.js in parallel to test boolean operations results. It can be used as a first step to check if it performs better or not.

sasensi commented 5 years ago

Actually, for this specific case, Skia has the same intersection bug 😞 (fiddle). And by tweeking path data just a little, Paper.js result is better (fiddle). It seems that they have problems with edge cases too.

lehni commented 5 years ago

Wow... That's pretty crazy :) And kinda good news for our code! It means we're not doing that badly...

hkrish commented 5 years ago

😆

lehni commented 5 years ago

I've reduced this case to this sketch for further analysis.