There are a number of implementations of sketchy rendering via rough.js available in Observable pages, but I was a little dissatisfied with either the work required to use them or their fragility. I’ve attempted to make a reasonably robust version that can be used with Observable Plot with minimal extra API surface (just add rough:{} to any mark specification).
Details here: Making Plot Sketchy / Jo Wood | Observable
Credit to Gordon Tu on whose implementation I have based this one.
This is glorious. I wonder if there could be an option (or even a default) for a seeded RNG?
Another useful tool could be to have a top-level rough: true option that makes every mark rough.
There’s already a seed option available ({seed: n} where n is any integer or null for no seeding) to fix the perturbation. But good point about making it the default.
And yes, a spec-wide rough:true would be useful. I will add this to the next version.
This is so good!
Thanks to the suggestions from Fil. I’ve updated the wrapper so it now allows top-level rough settings avoiding the need for per-mark changes. Finer level control is still possible on a per-mark basis when needed. I’ve also set the default to seed the random number generator so re-renders produce exactly the same result (unseeded randomisation is still possible by explicitly setting seed:0).
Documentation at Making Plot Sketchy / Jo Wood | Observable reflects these latest changes.
If I can make a further suggestion, when you set the top-level rough, a mark could opt out by having rough: false (or null)
Thanks Fil. Yes, that simplifies use of the API. Now added.
