Getting sections of an Image

Bit new to openFrameworks.

I am looking at loading in multiple images and drawing them on top of each other. Then sectioning up each image. This is so I can then click on different areas of the image to switch what section is shown. I’ve done a similar thing in Processing with a 2d PImage array and the get function.

I’m not sure how I would get sections of pixels and draw them in a similar way in openFrameworks.

Any suggestions with how this would be approached would be great.

(Here is some processing code which loads in 3 images and sections them up via a for loop and the get function.)

PImage[] focal = new PImage[3]; 


PImage[][][] focalGrid = new PImage[3][3][3];//3d array for seconed images

int[][] focalInt = new int[3][3]; 

void setup() {
  size(900, 600); //size of images
  //loading in images to be sectioned
  focal[0] = loadImage("focal0.jpg");   
  focal[1] = loadImage("focal1.jpg");   
  focal[2] = loadImage("focal2.jpg");   

  frameRate(5);
  
  for (int i = 0; i <= 2; i++) {
    for (int j = 0; j <= 2; j++) {
      focalInt[i][j]=0; //loading 0,0 in to int so starts on first image.
    }
  }
 
  for (int i = 0; i <= 2; i++) {
    for (int r = 0; r <= 2; r++) { //rows of my 3x3 grid - itterates through r=0, r=1, r=2
      for (int c = 0; c <= 2; c++) { //cols of my 3x3 grid - itterates through c=0, c=1, c=2
        //newfocal1[r + c*3] = focal1.get(r*300, c*200, 300, 200);
        focalGrid[i][r][c]= focal[i].get(r*300, c*200, 300, 200);
        //focalGrid[0] meaning first image
      }
    }
  }
}
    void draw() {

  for (int r = 0; r <= 2; r++) {
    for (int c = 0; c <= 2; c++) {
      image(focalGrid[focalInt[r][c]%3][r][c], r*300, c*200);
    }
  }
    }

hey @elliot - off the top of my head you could do this by using the ‘drawSubsection()’ method of ofImage.

http://openframeworks.cc/documentation/graphics/ofImage.html#!show_drawSubsection

cheers!

Cheers for this @nickhubben It was quite straight forward. Just trying to get used to the documentation.

Here is a little snippet. (Just the same as get for processing users apart from slightly different parameters)

//position and with and height for subsection to actually be drawn -(x, y, w, h)
    //position and with and height from source image -(sx, sy, sw, sh)
    //drawSubsection(x, y, w, h, sx, sy, sw, sh);

for (int i = 0; i <= 2; i++) {
        for (int r = 0; r <= 2; r++) { //rows of my 3x3 grid - itterates through r=0, r=1, r=2
            for (int c = 0; c <= 2; c++) { //cols of my 3x3 grid - itterates through c=0, c=1, c=2
                img.drawSubsection(r*300, c*200, 300, 200, r*300, c*200);
            }
        }
    }
1 Like