We are about to switch to a new forum software. Until then we have removed the registration on this forum.
Hi ~ I'm a newb of using Processing. I've been trying to make a mosaic program using Processing nowadays. What I really want to do is make a mosaic image with a set of images from web. http://www.hobbynote.com/bundles/wmdhobbynote/images/api/screen/tf1-the-voice-mosaique-facebook-01.jpg
I've made a mosaic image with rectangles filled with average colors of each area of original image. http://web1.c2.cyworld.com/myhompy/board/popupBoardImageFullView.php?home_id=a4204787&img_url=http://c2down.cyworld.co.kr/download?fid=642241a2ad57d69ba66141a2ad57b8db&name=%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202013-10-10%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%2011.00.10.png
Now, I'm trying to get average colors of web images (without displaying) , compare them and finally display them to the closest (in color) area. But I have a problem to compare average colors of web images with those of areas of original image. But I have no idea of what i have to do next, so I stop. I don't know how to get average colors of images without displaying. Is there anyone who can solve this problem? or is there another way to make a mosaic image with a set of images?? Thanks. Here is my code below. :D
import controlP5.*;
ControlP5 slide;
//setting the size of grids and transparency
int gridsize = (int) 10;
int tran = (int) 200;
void setup(){
PImage myImage;
myImage = loadImage("sunflower.png");
size(myImage.width, myImage.height);
image(myImage,0,0);
int larg = max(myImage.width, myImage.height);
// to prevent the size of a grid be bigger than the size of image
int[] values = { myImage.width, myImage.height, 30};
int rang = min(values);
slide = new ControlP5(this);
slide.addSlider("gridsize", 0, rang, (int)10, 20, 20, 50, 10);
slide.addSlider("tran", 0, 255, (int)200, 20, 40, 50, 10);
}
void draw(){
PImage myImage;
myImage = loadImage("sunflower.png");
size(myImage.width, myImage.height);
image(myImage,0,0);
int larg = max(myImage.width, myImage.height);
for (int h = 0; h < larg; h = h + gridsize){
for (int w = 0; w < larg; w = w + gridsize){
// get average colors of each area of original image
int SumOfR = 0;
int SumOfG = 0;
int SumOfB = 0;
int AverR = 0;
int AverG = 0;
int AverB = 0;
for (int x = 0; x < gridsize; x++){
for (int y = 0; y < gridsize; y++){
color myPixel = get(w+x, y+h);
int R = int (red(myPixel));
int G = int (green(myPixel));
int B = int (blue(myPixel));
SumOfR = SumOfR + R;
SumOfG = SumOfG + G;
SumOfB = SumOfB + B;
AverR = SumOfR / (gridsize * gridsize);
AverG = SumOfG / (gridsize * gridsize);
AverB = SumOfB / (gridsize * gridsize);
}
}
rectMode(CORNER);
noStroke();
println(AverR+"," +AverG+","+AverB);
fill(AverR, AverG, AverB, tran);
rect(w,h,gridsize,gridsize);
}
}
}
Answers
What is this loadImage() and size() ! in draw()?
See the What are setup() and draw()? article: make the image a global variable and load it only in setup().
See also the pixels[] array, it allows to access the colors in an image without needing to display it.
Also take a look at this following post -> forum.processing.org/two/discussion/comment/406
Thank you guys!! I think I should study more :)