Set portion of an image as another image

Hi,

I have a blank image (just white pixels) that is x, y pixels in width and height respectively. What I need to do is set another smaller image (dimensions (x0, y) where x0 < x) as a portion of the blank image. In the pic below for example, the blank image is the black rectangle and the smaller image is the red rectangle whose upper-left corner is set at some arbitrary coordinate.

processing

I tried using the set() function, however, when I use it only the base image is shown. I am not sure what I have done wrong here, so any help would be appreciated.

        //load image that will be set as portion of base image
       img = loadImage(...);

        //create base image
        baseImg = createImage(x, y, RGB);
        baseImg.loadPixels();
        for (int i = 0; i < baseImg .pixels.length; i++) {
          baseImg.pixels[i] = color(255, 255, 255, 0);
        }

        // set image to arbitrary location of base image
        set(100, 0, img);
        
        baseImg.updatePixels();

        //show image
        image(baseImg, ...);

I realized my mistake. I was supposed to call the set() function on the base image, not by itself.

This is probably the best way to do what you want.

//load image that will be set as portion of base image
img = loadImage(...);

//create composite image
PGraphics pg = createGraphics(x, y);
pg.beginDraw();
pg.background(255); // white background
pg.imageMode(CORNER);
pg.image(img, ix, iy); //ix, iy position of smaller image in lager image
pg.endDraw();

baseImg = pg.get(); // get as PImage - not needed can us PGraphics object pg instead


//show image
image(baseImg, ...);
// or this will do same
image(pg, ...);
1 Like