var imgtwo;

var x = 0;

​

function setup() {

  createCanvas(1400, 900);

  background(255);

​

​

  img = loadImage("assets/Ludwigstr-neu.jpg"); // Bild in Assets laden und hier Namen ändern

  imgtwo = loadImage("assets/Ludwigstrasse.png");  // Bild in Assets laden und hier Namen ändern

​

}

​

function draw() {

  // Pixel in Speicher laden

  img.loadPixels();

  imgtwo.loadPixels();

​

  let a = 10; // Dicke Streifen

  let c = 2;//Anzahl Bilder

  //let mouse = map(mouseX, 0, width, 0, a*(c-1));

​

  for (let x = 0; x < img.width; x += a * c) {

    var line = img.get(x, 0, a, img.height);

    image(line, x, 0); // Bild 1 (auskommentieren für Overlay)

​

    var line2 = imgtwo.get(x+a, 0, a, img.height);

    image(line2, x + a, 0); // Bild 2 (auskommentieren für Overlay)

    noStroke();

    fill(0);

    rect(x + mouseX, 0, a*(c-1), img.height); 

    //rect(x, 0, a*(c-1), img.height); // Streifen-Overlay (auskommentieren für Bild-Layer)

  }

}

​

function mousePressed() {

  saveCanvas(c, "screenshot", "jpg");

}

​