diagrams / diagrams-lib

Diagrams standard library
https://diagrams.github.io/
Other
138 stars 62 forks source link

Metaballs? #341

Open isovector opened 5 years ago

isovector commented 5 years ago

I want to render some organic looking paint splatters. It seems like a good fit for metaballs, so I was wondering if such a thing is possible in diagrams. I'm not sure the core abstractions allow for per-pixel blending, but it seems like this could be implemented as an svg primitive.

The website http://blobs.webflow.io/ has a good tutorial on faking metaballs by exploiting the blur and contrast css filters. SVG doesn't have a built-in contrast filter, but this stack overflow answer seems to implement it by hand: https://stackoverflow.com/questions/55323334/implementing-css-svg-contrast-filter-using-sharp-libvips

byorgey commented 5 years ago

The core abstractions definitely don't allow for per-pixel blending, but you're right that it could be added as a primitive with support from a particular backend like SVG. I certainly don't have the time or inclination to tackle this, but PRs are very welcome and I'm happy to provide guidance/pointers as needed.

isovector commented 5 years ago

If you could point me in the direction of how to make a primitive, I can probably do the rest!

byorgey commented 5 years ago

Really it's as simple as defining a data type to represent the primitive, and then defining an instance Renderable Blah SVG where Blah is your data type. See the other Renderable instances in diagrams-svg for examples. Since it's unlikely that other backends will ever support metaballs, the simplest approach would be for all this to just live in the diagrams-svg package. (The alternative would be to define the data type and combinators for constructing metaballs in diagrams-lib, and then the Renderable instance in diagrams-svg.)