let drawing = [];
let city;
function preload() {
city = loadImage("city.jpg");
}
function setup() {
createCanvas(city.width, city.height);
}
function mouseDragged() {
drawing.push({
mouseX: mouseX,
mouseY: mouseY,
});
}
function draw() {
colorMode(HSB);
// clear previous frame
background(city);
if (mouseIsPressed) {
// set line color to a range from light yellow to dark red
// using HSB color mode with hue from 40 to 0 and saturation and brightness at 100
stroke(random(0, 40), 100, 100);
// draw line from top right corner to mouse y-5 and y+5
line(width - 1, 0, mouseX, mouseY - 5);
line(width - 1, 0, mouseX, mouseY + 5);
line(width - 1, 0, mouseX + random(-5, 5), mouseY + random(-5, 5));
// set fill color to random
fill(random(0, 40), 100, 100);
// generate a random position within a radius of 10 of the mouse position
let x = mouseX + random(-20, 20);
let y = mouseY + random(-20, 20);
// draw a circle of radius 1 at the random position
circle(x, y, 2);
}
}
https://editor.p5js.org/106p01013/sketches/dgE9njGLj
我想用鼠标控制哥斯拉的射线,烧毁城市进行绘画。然而,每次我试图做一个油漆标记,光束线的效果都留在画布上。
我如何使用喷枪效果进行绘制而不让光束线有痕迹?
1条答案
按热度按时间anauzrmj1#
要在使用鼠标控制Godzilla的光线时使用喷枪效果进行绘制,您可以尝试使用p5.js中的blendMode()函数来调整绘图像素和背景图像之间的混合模式。以下是您的代码的更新版本,应该可以完成此任务:
在这个版本的代码中,喷雾图像是在preload中加载的()函数和blendMode函数用于在用于喷涂图像的加法混合模式和用于绘制的圆的正常混合模式之间切换。()函数首先将混合模式设置为ADD,在当前鼠标位置绘制喷雾图像,然后将混合模式设置回NORMAL。然后它循环通过绘图阵列中的每个点,并在该点周围10像素半径内的随机位置绘制随机色调的圆。
这将允许您在使用鼠标控制哥斯拉的光线时使用喷枪效果进行绘制,而不会在画布上留下光线的痕迹。