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 › gather around a shape
Page Index Toggle Pages: 1
gather around a shape (Read 450 times)
gather around a shape
Nov 14th, 2008, 4:17pm
 
I am currently using this section of code to make a number of balls gather around different points depending on a value, index, that groups them randomly.
Quote:
    float deltaX = ((index*300)+40)-x;
    float deltaY = ((index*60)+40)-y;
    




 // create springing effect
  deltaX *= springing;
  deltaY *= springing;
  accelX += deltaX;
  accelY += deltaY;

  // move predator's center   delete // to activate
  x += accelX;
  y += accelY;

  // slow down springing
  accelX *= damping;
  accelY *= damping;  
  




I want to make them gather around a line instead of a point. I want to create letters somehow, a line or series of nodes?? and have all balls from a certain group (the different groups appear as different colours) gather to that line or shape, but anywhere on that shape, not one specific point. Ultimately it should finish with three letters formed quite loosely, each letter being a different colour.

I really have no idea how to do this as the code I am using depends on a specific value for X and Y.

Any help would be much appreciated, this is my first real project on processing, I would love to get it done.

thanks

Paddy
Re: gather around a shape
Reply #1 - Dec 21st, 2008, 6:55am
 
I was wondering about that too.  Time to get the applied geometry book out.

According to this book (p. 45, Leen Ammeraal, Computer Graphics for Java Programmers, ISBN 0-471-98142-7), what you want is the projection of point P on line l, P'.  Here is the paraphrased pseudocode.

line l is described by points A and B.

vx = B.x - A.x
vy = B.y - A.y

len2 = vx * vx + vy * vy

inprod = vx * P.x - A.x + vy * (P.y - A.y)

P' = Point2D(A.x + inprod * vx/len2, A.y + inprod * vy/len2)


Needless to say, for credit and detailed explanation, please refer to the book.
Re: gather around a shape
Reply #2 - Jan 6th, 2009, 4:46pm
 
I was able to get orbs to gather and create a shape by doing this:

Code:

PImage _red;
PImage _green;
PImage _aqua;
PImage _royal;
PImage _alpha;

void setup() {
size(500,500);
_red = loadImage("red.png");
_green = loadImage("green.png");
_aqua = loadImage("aqua.png");
_royal = loadImage("royal.png");
_alpha = loadImage("alpha.png");
noLoop();
smooth();
}

void draw() {
PImage[] images = new PImage[4];
images[0] = _red;
images[1] = _green;
images[2] = _aqua;
images[3] = _royal;
int smoothness = 20000;

for(int i=0; i<smoothness; i++) {
int randomImage = int(random(0,4));
int x = int(random(_alpha.width));
int y = int(random(_alpha.height));
int s = int(random(3, 7));
color pix = _alpha.get(x, y);
PImage img = images[randomImage];

if(pix == -16777216) { // if pix is black
image(img, x, y, img.width/s, img.height/s);
}
}
}


"alpha.png" is a black and white image of the shape I'm trying to create. In my case it was a "B". The variable "smoothness" determines how many orbs will make up the "B". The higher that number is the more solid or smoother the "B" looks.

Each time the for loop is processed a pixel from "_alpha" is tested to see if it's black or white. Black is the positive space that makes up the shape and white is all the background (negative) space. Orbs are only drawn on the positive space.

I've just started using processing so there might be a much easier way to accomplish this.

You wouldn't know how to take what I've shown you and then make it so that all of the orbs higher up in the image are behind all the orbs lower in the image? Creating foreshortening in a sense.

Page Index Toggle Pages: 1