CreateImage из всего, что уже написано на холсте, чтобы использовать mask () - PullRequest
Новая
       82

CreateImage из всего, что уже написано на холсте, чтобы использовать mask ()

0 голосов
/ 26 мая 2020

Я создаю некоторое количество rect () на холсте и мне нужно создать изображение всего (читайте здесь, весь холст), чтобы использовать .mask () в p5.

Маска будет иметь форму графика c и будет работать, если изображение, которое нужно замаскировать, импортировано во время setup (). Однако я хочу создать интерфейс, в котором я могу управлять тем, что находится под маской, в реальном времени. (Это будут только rect (), интервал, размер и количество которых будут изменены) 

function setup() {
  createCanvas(600, 600);
  triMask = createGraphics(400, 400);
}
  
function draw() {
  background(255);
  triMask.fill('rgba(0, 0, 0, 1)');
  triMask.triangle(0, 0, 400, 0, 200, 400);
  // Unhide below to see the shape of the mask
  // image(triMask,100,100,400,400);
 
  fill('black');
  for (let i = 0; i <= 13; i++) {
        rect(100, 100 + 30*i, 400, 20);
  }

  let img = createImage(600, 600);
  img.loadPixels();
  //
  // Logic to copy what is on the canvas into this image?
  //
  img.updatePixels();
  img.mask(triMask);
  image(img, 600, 600);

  noLoop();
}

Возможно ли это?

...