<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.min.js"></script>
body {
margin: 0;
overflow: hidden;
}
function setup() {
createCanvas(windowWidth, windowHeight)
background('#fbf8f3')
}
// prevent touch gestures from dragging the page on touchscreens
function touchMoved() {
return false
}
function draw() {
if (mouseIsPressed) {
beads()
}
}
function beads() {
// set the color and brush style
fill(185, 83, 213, 180)
noStroke()
// find the distance between the current and previous mouse points
const distance = dist(mouseX, mouseY, pmouseX, pmouseY)
// find the midpoint between the current and previous mouse points
const midX = (mouseX + pmouseX) / 2
const midY = (mouseY + pmouseY) / 2
// draw a circle at the midpoint, with distance as its diameter
circle(midX, midY, distance)
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.