Scribble pen
Move the mouse to trace curved lines.
let trace
function setup() {
createCanvas(400, 400);
trace = createGraphics(width, height)
trace.background(220)
}
let x = 0
let y = 0
let x2 = 0
function draw() {
image(trace, 0, 0)
fill(0)
rectMode(CENTER)
rect(x, y, 20, 5)
line(0, y, 400, y)
line(x, 0, x, 400)
let ox = x, oy = y
y += sqrt(abs(mouseY - y)) * constrain(mouseY - y, -1, 1)
x += sqrt(abs(mouseX - x)) * constrain(mouseX - x, -1, 1)
trace.line(ox, oy, x, y)
}
function doubleClicked() {
trace.background(220)
}(Originally seen at https://editor.p5js.org/bojidar-bg/sketches/H2UjU-6jl)
Browse more articles?
← Sunshine Experiments tagged p5 (28/85) XOR lissajous →
← Sunshine Experiments tagged interactive (9/26) Splats →
← Sunshine Experiments on this site (28/85) XOR lissajous →