We closed this forum 18 June 2010. It has served us well since 2005 as the ALPHA forum did before it from 2002 to 2005. New discussions are ongoing at the new URL http://forum.processing.org. You'll need to sign up and get a new user account. We're sorry about that inconvenience, but we think it's better in the long run. The content on this forum will remain online.
IndexProgramming Questions & HelpPrograms › Help: making a 'caricature' of an image
Page Index Toggle Pages: 1
Help: making a 'caricature' of an image (Read 977 times)
Help: making a 'caricature' of an image
May 28th, 2008, 4:53pm
 
For a project I intend to make interactive 'caricatures' of images. I wish to gradually magnify certain areas of an oploaded jpg file. The idea is much like a caricature of a face. For example; if eyes are prominent in a portrait, they are exaggerated and magnified in a caricature.

To know which parts of an image should be magnified, the location of the mouse is put in an array for every frame.  After the user releases the mouse and presses a key, the 'caricature' is generated from the image and points from the array. The more the mouse is located in a certain area, the more magnified this area becomes. At least... That's what I wish to accomplish. I tried the 'copy' function, but that gave an ugly result (like messed-up pixels).

Could you please give me some clues about how to program in such a way that parts of an image are magnified gradually like in a caricature?
Re: Help: making a 'caricature' of an image
Reply #1 - May 28th, 2008, 6:54pm
 
Try this:
Code:
final float effectAmount = 0.75;

void Spherize(int xPos, int yPos, int radius)
{
int tlx = xPos - radius, tly = yPos - radius;
PImage pi = get(tlx, tly, radius * 2, radius * 2);
for (int x = - radius; x < radius; x++)
{
for (int y = - radius; y < radius; y++)
{
// Rescale cartesian coords between -1 and 1
float cx = (float)x / radius;
float cy = (float)y / radius;

// Outside of the sphere -> skip
float square = sq(cx) + sq(cy);
if (square >= 1)
continue;

// Compute cz from cx & cy
float cz = sqrt(1 - square);

// Cartesian coords cx, cy, cz -> spherical coords sx, sy, still in -1, 1 range
float sx = atan(effectAmount * cx / cz) * 2 / PI;
float sy = atan(effectAmount * cy / cz) * 2 / PI;

// Spherical coords sx & sy -> texture coords
int tx = tlx + (int)((sx + 1) * radius);
int ty = tly + (int)((sy + 1) * radius);

// Set pixel value
pi.set(radius + x, radius + y, get(tx, ty));
}
}
set(tlx, tly, pi);
}

int startX, startY;
PImage me;

void setup()
{
background(#ABCDEF);
me = loadImage("E:/Dev/PhiLhoSoft/Processing/me.png");
size(me.width, me.height);
image(me, 0, 0);
}

void draw()
{
}

void mousePressed()
{
startX = mouseX; startY = mouseY;
}

void mouseReleased()
{
float radius = sqrt(sq(startX - mouseX) + sq(startY - mouseY));
Spherize(startX, startY, int(radius));
}

Replace the path to the image by one of your computer with the photo of somebody.
Drag from the center of an eye to a corner, etc.
Maybe improve it by smoothing the borders (some alpha value?).

[EDIT] =>
Code:
	// Set pixel value
int alpha = (int)(255 * sq(1 - square)) << 24;
pi.set(radius + x, radius + y, alpha | (0xFFFFFF & get(tx, ty)));
Re: Help: making a 'caricature' of an image
Reply #2 - May 29th, 2008, 6:30pm
 
Thank you for your great code, PhiLho! Again, I integrated it into my program. It has helped me al lot to come closer to my final goal.

I greatly appreciate all your help. Thank you so much!
Page Index Toggle Pages: 1