Question

在我的代码中，我尝试将27张图像保存到我的下载文件夹中，但是当我运行代码时，它最多仅将10张图像保存到我的下载文件夹中。我将结果记录在控制台中，并且代码似乎可以正常运行。最初，我认为Chrome或在线p5.js Web编辑器在同时发送太多保存请求时遇到了问题，因此我尝试在每次保存后都延迟几秒钟，但是这种方法不起作用。 Chrome允许从单个站点下载的次数（可能在一定时间内）有限制吗？

我知道代码效率不高，但是速度现在并不重要，因为我只是在测试某些东西，而for循环是出于特定原因而构造的。

let t, w, img, mod, p, dim;

function preload() {
//image loaded
img = loadImage("rose.jpg");
}

function update(pos, a, b, c) {
  let i = img.pixels[pos + a];
  let j = img.pixels[pos + b];
  let k = img.pixels[pos + c];
  let l = img.pixels[pos + 3];
  return [i, j, k, l];
}

function setup() {
  // modified image created and its pixels loaded
 image(img, 0, 0, width, height);
  mod = createImage(img.width, img.height);
  img.loadPixels();
  mod.loadPixels();

  // 3 for loops make counter for image names
  for (let i = 0; i < 3; i++) {
    for (let j = 0; j < 3; j++) {
      for (let k = 0; k < 3; k++) {
        //loop through the pixels of the image
        for (let l = 0; l < mod.height * 4; l++) {
          //m is incremented by 4 so each set of rgba values can be manipulated by the update function
          for (let m = 0; m < mod.width; m += 4) {
            //pixel index is calculated and update returns an array of pixel values
            w = img.width * l + m;
            t = update(w, i, j, k);
            for (let n = 0; n < 4; n++) {
              mod.pixels[w + n] = t[n];
            }
          }
        }
        //canvas is created and image is displayed
        mod.updatePixels();
        dim = 550;
        createCanvas(dim, dim);
        image(mod, 0, 0, width, height);
        //save request
        save(mod, ("edited" + i + j + k + ".jpg"));
      }
    }
  }
}

Answer 1

P5.js是开源的。您可以在p5.prototype.downloadFile函数中查看下载文件here的源代码。

我看不到可以下载多少文件的任何限制，所以我猜是p5.js用于保存文件的是来自浏览器还是来自the library。您可能想尝试其他浏览器，或者查看文件保存库中是否有限制。

对于它的价值，我使用以下简化示例进行了尝试：

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  ellipse(mouseX, mouseY, 20, 20);
  // save(frameCount + ".png");
}

function mouseClicked() {
  for(let i = 0; i < 100; i++) {
    save(i + ".png");
  }
}

如果单击鼠标，则仅保存10张图像。有趣的是，它们并不总是前10位，因此在保存调用之间似乎发生了某种竞争。

但是，如果我取消对save()函数中对draw()的调用的注释，则可以保存10个以上的图像，但是似乎大多数图像都被跳过了。

我试图在p5.js中保存27张图像，但是只有10张保存到我的下载文件夹中。为什么不保存所有文件？

1 个答案: