Dividing up PImage


#1

Hello all!
I have a question/problem regarding PImages. I am working on a project that converts MIDI text files into images, concatenates those images into one large image, and then divides that long image into 8888 pixel squares. So far, I have successfully converted individual MIDI files into PImages and combined those images into one long image (its dimensions are 88 pixels by about 11,176 pixels). However, when I try to separate this long image into separate 8888 square PImages, all the resulting PImages are completely black, rather than black and white. I have created a simple graphic illustrating my plans/objective. The first two steps have been completed.

Here is my complete code: The problem, I believe, should be around line 82 or 98.


String[][] lines;
int yoff;
PImage[] images;
PImage newim;
color[][] divpix;

void setup() {
  size(800, 800); 
  //surface.setResizable(true);
  background(255);
  images = new PImage[12];
  lines = new String[12][];
  yoff = 0;

  lines[0] = loadStrings("aprilfull.txt");
  lines[1] = loadStrings("august.txt");
  lines[2] = loadStrings("december.txt");
  lines[3] = loadStrings("February.txt");
  lines[4] = loadStrings("january.txt");
  lines[5] = loadStrings("july.txt");
  lines[6] = loadStrings("june.txt");
  lines[7] = loadStrings("march.txt");
  lines[8] = loadStrings("may.txt");
  lines[9] = loadStrings("november.txt");
  lines[10] = loadStrings("october.txt");
  lines[11] = loadStrings("september.txt");

  for (int i = 0; i< images.length; i++) {
    println(i);
    produceImages(lines[i], i);
  }

  println("DONE");

  for (int i = 0; i< images.length; i++) {
    String name = "season" + i + ".jpg";
    images[i].save(name);
  }
  int len = 0;
  for (int j = 0; j< images.length; j++) {
    images[j].loadPixels();    
    len += images[j].pixels.length;
  }
  len /= 88;
  newim = createImage(len, 88, RGB);
  newim.loadPixels();
  //newim.pixels[] concatPix = new int[len];
  int ind = 0;

  for (int i = 0; i< 88; i++) {
    for (int j = 0; j< images.length; j++) {
      for (int k = i*images[j].width; k<(i+1)*(images[j].width); k++) {
        newim.pixels[ind] = images[j].pixels[k];        
        // println(images[j].pixels[k].);
        ind++;
        newim.updatePixels();
      }
    }
  }


  println("DONE2");
  int totalwid = newim.width;
  println(totalwid);
  println(newim.height);
  int rem = (totalwid)%88;
  println(totalwid/88);


  divpix = new color[totalwid/88][7744];
  PImage[] trainingSet = new PImage[totalwid/88];

  int allocator = 0;
  int counter = 0;
  for (int vertStack = 0; vertStack < newim.height; vertStack ++) {
    for (int horizIndex = 0; horizIndex < newim.width - rem; horizIndex++) {
      if (horizIndex %88 ==0 && horizIndex != 0) allocator ++;
      divpix[allocator][horizIndex - allocator * 88] = color(newim.get(horizIndex, vertStack));
      //print(red(newim.get(horizIndex, vertStack)) + "," + green(newim.get(horizIndex, vertStack)) + "," + blue(newim.get(horizIndex, vertStack)) + " | ");
      if (red(newim.get(horizIndex, vertStack)) != 0 ||green(newim.get(horizIndex, vertStack)) != 0 || blue(newim.get(horizIndex, vertStack)) != 0) {
        // print(counter + " " + (red(newim.get(horizIndex, vertStack)) + green(newim.get(horizIndex, vertStack)) + blue(newim.get(horizIndex, vertStack)))/3 + " | " );
        print(counter + " " + (red(divpix[allocator][horizIndex - allocator * 88]) + green(divpix[allocator][horizIndex - allocator * 88]) + blue(divpix[allocator][horizIndex - allocator * 88]))/3 + " | " );
        counter++;
      }
    }
    allocator = 0;
  }
  println(counter);
  println("done2.5");

  for (int i = 0; i<trainingSet.length; i++) {

    trainingSet[i] = createImage(88, 88, RGB);
    trainingSet[i].loadPixels();
    for (int j = 0; j < trainingSet[i].pixels.length; j++) {
      if ((red(divpix[i][j]) + green(divpix[i][j]) + blue(divpix[i][j]))/3 != 0)
        print((red(divpix[i][j]) + green(divpix[i][j]) + blue(divpix[i][j]))/3 + " ");
      trainingSet[i].pixels[j] = divpix[i][j]; 
      trainingSet[i].updatePixels();
    }
    String name2 = "trainingData/" + i + ".jpg";

    trainingSet[i].save(name2);
  }

  println("Done3");

  newim.updatePixels();
  //newim.save("Concatenated.jpg");
}

void produceImages(String[] noteLines, int which) {
  ArrayList<String> newLines;
  int[][] notes;
  int placeHolder;
  int beatTC;
  int meterDivisor;

  newLines =  new ArrayList<String>();
  beatTC = 0;

  for (int i = 0; i< noteLines.length; i++) {
    if (noteLines[i].contains(" On ch=")) {
      int firstSpace = noteLines[i].indexOf(" ");
      int nVal = noteLines[i].indexOf("n=");
      int vVal = noteLines[i].indexOf("v=");
      newLines.add(new String(noteLines[i].substring(0, firstSpace) + "," + noteLines[i].substring(nVal+2, vVal-1) + "," + noteLines[i].substring(vVal+2, noteLines[i].length())));
    }
  }
  //printArray(newLines.toArray());
  placeHolder = Integer.parseInt(newLines.get(0).substring(0, newLines.get(0).indexOf(",")));
  int pH2 = 0;
  for (int i = 0; i< newLines.size(); i++) {
    if (!(Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(","))) == placeHolder)) {
      pH2 = Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(",")));
      break;
    }
  }

  meterDivisor = pH2- placeHolder;
  int maxim = 0;
  for (int i = 0; i< newLines.size(); i++) {
    if ((Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(",")))) > maxim) maxim = (Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(","))));
  }
  beatTC = (maxim - placeHolder)/meterDivisor;

  notes = new int[88][beatTC + 1];

  for (int i = 0; i<newLines.size(); i++) {
    int nvst = newLines.get(i).indexOf(",") +1;
    int nVal2 = Integer.parseInt(newLines.get(i).substring(nvst, newLines.get(i).indexOf(",", nvst))) - 21;
    int val = Integer.parseInt(newLines.get(i).substring(newLines.get(i).indexOf(",", nvst) +1, newLines.get(i).length()));
    //  println(beatTC);
    println("beatTC: " + beatTC + "| Which: " + which + "| nVal2: " + nVal2 + "| meter divisor: " + meterDivisor + "| timestamp Index: " + (Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(","))) - placeHolder)/meterDivisor);
    // println((Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(","))) - placeHolder)/meterDivisor);
    println("X: " + (Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(",")))));
    println(placeHolder);
    println("-----------------------------------");
    if ((Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(",")))) > placeHolder) notes[nVal2][(Integer.parseInt(newLines.get(i).substring(0, newLines.get(i).indexOf(","))) - placeHolder)/meterDivisor]= int(map(val, 0, 200, 1, 255));
  }

  int[] pixvals = new int[notes.length * notes[0].length];
  int ck = 0;
  for (int i = notes.length-1; i>=0; i--) {
    for (int j = 0; j< notes[0].length; j++) {
      pixvals[ck] = notes[i][j];
      ck++;
    }
  }



  images[which] =createImage(notes[0].length, notes.length, RGB);
  images[which].loadPixels();

  for (int i = 0; i < images[which].pixels.length; i++) {
    images[which].pixels[i] = color(pixvals[i]);
    //images[which].pixels[i] = color(255, 0, 0);
  }

  images[which].updatePixels();
}






void draw() {

  //for (int i = 0; i< images.length; i++) {
  //  image(images[i], (width-(images[i].width))/2, yoff);
  //  yoff += 88;
  //}
  image(newim, 20, height/2);
  fill(0);
  text(newim.width + " | " + newim.height, width/2, height/2);
  //image(img, (width-(img.width))/2, (height-(img.height))/2);
}

The files can be obtained by putting these MIDI files: http://www.piano-midi.de/tschai.htm through this MIDI to text converter: http://flashmusicgames.com/midi/mid2txt.php


#2

You’ll have better luck if you post a MCVE that splits up a hard-coded image into smaller images.


#3

Hi.
Try this:

PImage inputimg;

void setup() {
  inputimg = loadImage("image.png");

  size(1200, 88);
}

void draw() {
  background(0);
  image(inputimg, 0, 0);

  for (int i = 0; i*88 < inputimg.width; i ++) {
    PGraphics out = new PGraphics();
    out = createGraphics(88, 88);
    out.beginDraw();
    out.image(inputimg, -i * 88, 0);
    out.endDraw();
    out.save("part " + i + ".png");
  }

  exit();
}

With this image:

Put the image in the data directory. Also the result images will be located there.


#4

@MxFxM @Kevin Thank you both very much! Kevin, I took your advice and worked out the problem with less images in a separate program, but MxFxM, you provided a much more clever/less resource intensive way to do it than I could come up with. Thank you both!

  • Trilobyte