p5.j​​s和一个奇怪的结果

Question

我正在尝试使用字符绘制图像，而背景中没有原始图像。

我知道在P5上绘制图像之后删除图像并不容易，因此我尝试了几种不同的方法。我刚刚遇到的问题是与实际图像相比，文本颜色有些偏离。

下面是代码，原始照片，结果以及我尝试过的其他一些方法！ ：

已解决！ 通过用img.get替换get并更正x和y if语句以允许文本值之间的间距，可以解决此问题。谢谢您的帮助！

原始图片

所需输出的示例 [！[所需的输出] [3]] [3]

将像素校正为img.pixels后的输出 [！[更改后的输出] [4]] [4]

更新代码：

img = null;
width = 0;
height = 0;
nX = 0;
nY = 0;
textSize = 20; 
color = (0,0,0);
var colors = [];
timer = 0;

function preload(){
    img = loadImage("input.jpg");
    img.loadPixels();
    width = img.width;
    height = img.height;
}

function setup() {
    createCanvas(img.width, img.height);
}

function draw() {
    image(img, 0, 0);
    img.loadPixels();
    textSize(16);
    noiseDetail(0.1);

    for(y = 0; y <= img.height; y++){
        for(x = 0; x <= img.width; x++){
            nX = noise(x);
            nY = noise(y);
            if(x%20==0&&y%20==0){
                color = img.get(x,y);
                fill(color);
                text(color[0],nX+x,nY+y);
            }
        }
    }
}

我尝试过的方法：

• 迭代并添加到数组中，但是遇到另一个错误
• 仅覆盖图像，但背景图像仍然具有很强的显示力
• 每个值的颜色，x和y的值的数组，清除然后尝试不成功地获取这些值，但是当我这样做时，这些值超出了图片的后半部分，即从右上角到左下角，是黑色的，尽管图像中不是黑色的。

非常感谢那些帮助编辑此帖子的人。

Answer 1

停止在屏幕上绘制图像。

不是使用pixels数组来获取屏幕的颜色，而是使用img.pixels来直接引用图像的颜色。这样，您不必将图像绘制到屏幕上。