Set portion of an image as another image


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.


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);
        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);

        //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.background(255); // white background
pg.image(img, ix, iy); //ix, iy position of smaller image in lager image

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