andy warhol effect

Programming Questions

hube1987

in Programming Questions • 1 year ago

Hi to everyone, i'm new on this forum.
I have a problem with a .pde written by myself. I have to obtain four little images on the right of my output modified with the andy warhol effect and equal to a bigger image that i have to obtain on the right of the output.

I obtain this output:

even if the starting image (that i should see on the left) is this:

This is the code i wrote:

PImage g_image;
PImage g_imageSxUP = new PImage(200,200);
PImage g_imageSxDW = new PImage(200,200);
PImage g_imageDxUP = new PImage(200,200);
PImage g_imageDxDW = new PImage(200,200);
PImage g_output = new PImage(800,400);

int g_width = 800;
int g_height = 400;

PFont g_font;

int g_index = 1;

color g_colors[] = new color[10];
color g_colorsIn[] = new color[10];

void setup() {

g_font = loadFont("Univers-66.vlw");
textFont(g_font, 12);

size(g_width, g_height, P2D);

colorMode(RGB, 255, 255, 255, 255);

loadDiskImage(g_index);

background(0, 0, 0);

g_colors[0] = color(255,0,0);
g_colors[1] = color(0,128,0);
g_colors[2] = color(0,0,255);
g_colors[3] = color(0,0,0);
g_colors[4] = color(1,1,1);
g_colors[5] = color(255,255,0);
g_colors[6] = color(255,165,0);
g_colors[7] = color(128,0,128);
g_colors[8] = color(238,130,238);
g_colors[9] = color(0,255,0);

}

int getColorW(color p_colIn, color p_col[])
{
int index = 0;
float distanza = 999999999;
int pixelImgOut;

        float cR_px = red(p_colIn);
        float cG_px = green(p_colIn);
        float cB_px = blue(p_colIn);
        for(int i = 0; i < 10; i++)
        {
            float aR = red(g_colorsIn[i]);
            float aG = green(g_colorsIn[i]);
            float aB = blue(g_colorsIn[i]);
            float rr = cR_px - aR;
            float gg = cG_px - aG;
            float bb = cB_px - aB;
            float d = (rr * rr) + (gg * gg) + (bb * bb);
            if(d < distanza)
            {
                distanza = d;
                index = i;

            }



    }

   return index;

}

void getRandomPixels()
{
int index;

for( int i=0; i<10; i++ )
{
    index = int(random(0,400*400-1));
    g_colorsIn[i] = g_image.pixels[index];
}

}

void doEffect()
{
int loc, out;
float r,g,b,rc,gc,bc;
float dr;
float dg;
float db;
float distance;

color colArray1[] = {g_colors[0],g_colors[1],
                       g_colors[2],g_colors[3],
                       g_colors[4],g_colors[5],
                       g_colors[6],g_colors[7],
                       g_colors[8],g_colors[9]};

color colArray2[] = {g_colors[1],g_colors[0],
                       g_colors[3],g_colors[2],
                       g_colors[5],g_colors[4],
                       g_colors[7],g_colors[6],
                       g_colors[9],g_colors[8]};

color colArray3[] = {g_colors[2],g_colors[3],
                       g_colors[0],g_colors[1],
                       g_colors[6],g_colors[7],
                       g_colors[4],g_colors[5],
                       g_colors[9],g_colors[8]};

color colArray4[] = {g_colors[3],g_colors[2],
                       g_colors[1],g_colors[0],
                       g_colors[7],g_colors[6],
                       g_colors[5],g_colors[4],
                       g_colors[9],g_colors[8]};

getRandomPixels();

for (int i = 0; i < g_height; i++)
{
    for (int j = 0; j < g_height; j++)
    {
      loc = i + j * g_height;

      if( loc%2 == 0 )
      {
        out = i/2 + j/2 * 200;

        int best_i = getColorW(g_image.pixels[loc], colArray1);
        g_imageSxUP.pixels[out] = colArray1[best_i];

        best_i = getColorW(g_image.pixels[loc], colArray2);
        g_imageSxDW.pixels[out] = colArray2[best_i];

        best_i = getColorW(g_image.pixels[loc], colArray3);
        g_imageDxUP.pixels[out] = colArray3[best_i];

        best_i = getColorW(g_image.pixels[loc], colArray4);
        g_imageDxDW.pixels[out] = colArray4[best_i];
      }
    }
}

preProcessImages();

}

void preProcessImages()
{    loadPixels();
        for(int i1 = 0; i1 < g_height; i1++)
        {
            for(int k1 = 0; k1 < g_height; k1++)
            {
                int i = i1 + k1 * g_height;
                int k = i1 + k1 * 800;
                g_output.pixels[k] = g_image.pixels[i];
            }

        }

        int j1 = g_height / 2;
        for(int l1 = 0; l1 < j1; l1++)
        {
            for(int i2 = 0; i2 < j1; i2++)
            {
                int j = l1 + i2 * j1;
                int l = g_height + l1 + i2 * 800;
                g_output.pixels[l] = g_imageSxUP.pixels[j];
                l = g_height + j1 + l1 + i2 * 800;
                g_output.pixels[l] = g_imageSxDW.pixels[j];
                l = g_height + l1 + (j1 + i2) * 800;
                g_output.pixels[l] = g_imageDxUP.pixels[j];
                l = g_height + j1 + l1 + (j1 + i2) * 800;
                g_output.pixels[l] = g_imageDxDW.pixels[j];
            }

        }

        updatePixels();
}

void loadDiskImage( int p_image )
{
g_image = loadImage("image_"+p_image+".jpg");
}

void draw()
{

background(g_output);

}

void keyPressed()
{
if(key == 'p')
{

    doEffect();

}
else
if( key == '+' )
{

    g_index++;
    if( g_index >4 ) g_index = 4;
    loadDiskImage(g_index);
    doEffect();

}
else
if( key == '-' )
{

    g_index--;
    if( g_index <1 ) g_index = 1;
    loadDiskImage(g_index);
    doEffect();

}
}

Could someone help me to find what i wrong?
Thanks in advance for your attention.

Goodbye to all.

Replies(2)

PhiLho

Re: andy warhol effect

1 year ago

To know what is wrong in code, we have to know what is wrong in output, ie. what you really expected...
Some remarks:
- You don't need g_width and g_height: just define size() with constant values (useful when exporting to an applet) and use the built-in constants width and height.
- size() should be the first call in setup().
- You use mystery numbers:
index = int(random(0, 400*400-1));
out = i/2 + j/2 * 200;
Perhaps these numbers should depend on the size of the sketch or the size of the image... Or should use another constant.
- Usage of new PImage() is discouraged, you should use createImage() instead.

Finally, if you resize the input image to the expected size (400x400), your sketch is probably closer of what you expected...

PImage g_image;
PImage g_imageSxUP = createImage(200, 200, RGB);
PImage g_imageSxDW = createImage(200, 200, RGB);
PImage g_imageDxUP = createImage(200, 200, RGB);
PImage g_imageDxDW = createImage(200, 200, RGB);
PImage g_output = createImage(800, 400, RGB);
PFont g_font;
int g_index = 1;
color g_colors[] = new color[10];
color g_colorsIn[] = new color[10];
void setup() {
size(800, 400, P2D);
// g_font = loadFont("Univers-66.vlw");
// textFont(g_font, 12);
colorMode(RGB, 255, 255, 255, 255);
loadDiskImage(g_index);
background(0, 0, 0);
g_colors[0] = color(255, 0, 0);
g_colors[1] = color(0, 128, 0);
g_colors[2] = color(0, 0, 255);
g_colors[3] = color(0, 0, 0);
g_colors[4] = color(1, 1, 1);
g_colors[5] = color(255, 255, 0);
g_colors[6] = color(255, 165, 0);
g_colors[7] = color(128, 0, 128);
g_colors[8] = color(238, 130, 238);
g_colors[9] = color(0, 255, 0);
}
int getColorW(color p_colIn, color p_col[])
{
int index = 0;
float distanza = 999999999;
int pixelImgOut;
float cR_px = red(p_colIn);
float cG_px = green(p_colIn);
float cB_px = blue(p_colIn);
for (int i = 0; i < 10; i++)
{
float aR = red(g_colorsIn[i]);
float aG = green(g_colorsIn[i]);
float aB = blue(g_colorsIn[i]);
float rr = cR_px - aR;
float gg = cG_px - aG;
float bb = cB_px - aB;
float d = (rr * rr) + (gg * gg) + (bb * bb);
if (d < distanza)
{
distanza = d;
index = i;
}
}
return index;
}
void getRandomPixels()
{
int index;
for ( int i=0; i<10; i++ )
{
index = int(random(0, 400*400-1)); // Why these arbitrary numbers?
g_colorsIn[i] = g_image.pixels[index];
}
}
void doEffect()
{
int loc, out;
float r, g, b, rc, gc, bc;
float dr;
float dg;
float db;
float distance;
color colArray1[] = {
g_colors[0], g_colors[1],
g_colors[2], g_colors[3],
g_colors[4], g_colors[5],
g_colors[6], g_colors[7],
g_colors[8], g_colors[9]
};
color colArray2[] = {
g_colors[1], g_colors[0],
g_colors[3], g_colors[2],
g_colors[5], g_colors[4],
g_colors[7], g_colors[6],
g_colors[9], g_colors[8]
};
color colArray3[] = {
g_colors[2], g_colors[3],
g_colors[0], g_colors[1],
g_colors[6], g_colors[7],
g_colors[4], g_colors[5],
g_colors[9], g_colors[8]
};
color colArray4[] = {
g_colors[3], g_colors[2],
g_colors[1], g_colors[0],
g_colors[7], g_colors[6],
g_colors[5], g_colors[4],
g_colors[9], g_colors[8]
};
getRandomPixels();
for (int i = 0; i < height; i++)
{
for (int j = 0; j < height; j++)
{
loc = i + j * height;
if ( loc%2 == 0 )
{
out = i/2 + j/2 * 200; // Where the 200 comes from?
int best_i = getColorW(g_image.pixels[loc], colArray1);
g_imageSxUP.pixels[out] = colArray1[best_i];
best_i = getColorW(g_image.pixels[loc], colArray2);
g_imageSxDW.pixels[out] = colArray2[best_i];
best_i = getColorW(g_image.pixels[loc], colArray3);
g_imageDxUP.pixels[out] = colArray3[best_i];
best_i = getColorW(g_image.pixels[loc], colArray4);
g_imageDxDW.pixels[out] = colArray4[best_i];
}
}
}
preProcessImages();
}
void preProcessImages()
{
loadPixels();
for (int i1 = 0; i1 < height; i1++)
{
for (int k1 = 0; k1 < height; k1++)
{
int i = i1 + k1 * height;
int k = i1 + k1 * 800;
g_output.pixels[k] = g_image.pixels[i];
}
}
int j1 = height / 2;
for (int l1 = 0; l1 < j1; l1++)
{
for (int i2 = 0; i2 < j1; i2++)
{
int j = l1 + i2 * j1;
int l = height + l1 + i2 * width;
g_output.pixels[l] = g_imageSxUP.pixels[j];
l = height + j1 + l1 + i2 * width;
g_output.pixels[l] = g_imageSxDW.pixels[j];
l = height + l1 + (j1 + i2) * width;
g_output.pixels[l] = g_imageDxUP.pixels[j];
l = height + j1 + l1 + (j1 + i2) * width;
g_output.pixels[l] = g_imageDxDW.pixels[j];
}
}
updatePixels();
}
void loadDiskImage( int p_image )
{
// g_image = loadImage("image_"+p_image+".jpg");
g_image = loadImage("H:/Temp/Tree.jpg");
g_image.resize(400, 400);
}
void draw()
{
background(g_output);
}
void keyPressed()
{
if (key == 'p')
{
doEffect();
}
else if ( key == '+' )
{
g_index++;
if ( g_index >4 ) g_index = 4;
loadDiskImage(g_index);
doEffect();
}
else if ( key == '-' )
{
g_index--;
if ( g_index <1 ) g_index = 1;
loadDiskImage(g_index);
doEffect();
}
}

Above is your code reformatted with Ctrl+T and after applying my advices (and some little changes to ease my testing: no need to load a font, and get your image from my disk).
The resize() call is the key to make it work...

hube1987

Re: andy warhol effect

1 year ago

Thanks PhiLho, I'll never stop thanking you.

The problem was exactly the absence of the command resize, now that I've applied your advices everything works right.

The value at the line 73 is only arbitrary while the value at the line 128 is due to the size of the four little images on the right of the output because 200 is their heights.

Thank you very much for your help and your kindness!

Top Reply