p5.js adapter · v0.2.0

Sketch.
Then plot.

Turn p5.js and p5.waves geometry into a real vanilla.penplotter job—without capturing pixels or rebuilding the machine pipeline.

Connect p5.js Explore examples
p5.waves → PlotPlanp5.js 2.2.2
— paths — lifts — px travel

A deliberately small bridge

Three p5 methods.
One real engine.

  1. 01createPlotterEngine()

    Uses the current canvas size as a friendly default and returns the independent core engine.

  2. 02drawPlotPlan()

    Draws the actual ordered plan, including path reversals and relocated seams.

  3. 03createPlot()

    Every plot.… call draws on the canvas and is remembered for the plotter; plot.go() sends it straight to the pen, no SVG in between. Direct plot →

  4. Corevanilla.penplotter

    Owns geometry, optimization, planning, exports, statistics and hardware drivers.

Explicit installation

No hidden
dependency.

The adapter receives the p5 constructor and core class explicitly. Versions and loading order stay visible.

import { PlotterEngine } from "vanilla.penplotter";
import { installP5Penplotter } from "p5.penplotter";

installP5Penplotter(p5, PlotterEngine);

function setup() {
  createCanvas(800, 800);
  const plot = createPlotterEngine();
  plot.circle(400, 400, 180);
  drawPlotPlan(plot.plan());
}