p5.scribble

The library p5.scribble allows users to draw out primitive 2D features with a sketch style. It’s a different aesthetic from the conventional and smooth look of regularly coded p5 shapes and details and allows room for more roughness in the drawings. Filling in color creates a scribbling effect that isn’t completely cohesive as well.The hand drawn look presents a friendlier approach to the program, particularly when it comes to displaying charts and data collection.

In order to use, this file has to be included:

/path/to/p5.scribble.js

And then you have to create an instance:

var scribble = new Scribble();              // global mode
var scribble = new Scribble( p5Instance );  // instance mode

p5.scribble also allows users to change the general appearance of the scribble effect, including the neatness and bowing of the lines and the amount of offset allowed in coordinates.

scribble.bowing = yourValue;          // changes the bowing of lines
scribble.roughness = yourValue;       // changes the roughness of lines
scribble.maxOffset = yourValue;       // coordinates will get an offset, here you define the max offset
scribble.numEllipseSteps = yourValue; // defines how much curves will be used to draw an ellipse

library link: https://github.com/generative-light/p5.scribble.js

code example: https://github.com/generative-light/p5.scribble.js/blob/master/examples/chart.html

This is a usage of p5.scribble in making a bar graph with various line visuals.