使用p5.js在图像上移动形状

Question

这里是图像：

“>

我正在使用p5.js在图像上绘制随机圆。我下面有使圆环出现的代码，我想要。但是，我也希望所有点都可以摆动。我在弄清楚这方面时遇到了麻烦。我感谢任何提示！谢谢

let img;
let smallPoint, largePoint;
let fr = 30;

function preload() {
    img = loadImage('images/face.png');
}

function setup() {
    createCanvas(720, 800);
    let cvn = createCanvas(1000, 1000);
    let x = (windowWidth - width) / 2;
    let y = (windowHeight - height) / 2;
    cvn.position(x,y);
    smallPoint = 5;
    largePoint = 20;
    noStroke();
    background(255);
    image(img, 0, 0, 720, 800);
    img.loadPixels();
    frameRate(fr);
}

function draw() {
    let pointillize = map(mouseX, 0, width, smallPoint, largePoint);
    let x = floor(random(img.width));
    let y = floor(random(img.height));
    let pix = img.get(x, y);
    fill(pix);
    ellipse(x, y, pointillize, pointillize);
}

[这里是图像：我正在使用p5.js在图像上绘制随机圆。我下面有使圆环出现的代码，我想要。但是，我也希望所有点都可以摆动。我是...

Answer 1

要实现所需的设置，必须更改设置。您必须重新绘制每帧中的所有点。