Processing 1.0 - Processing Discourse - How to do this shape ?

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.

Index › Programming Questions & Help › Programs › How to do this shape

‹ Previous Topic | Next Topic ›

Pages: 1

How to do this shape ? (Read 952 times)

TweakingKnobs Full Member Offline Posts: 158	How to do this shape ? Apr 29^th, 2010, 7:57am hi , i want to change in this sketch : http://openprocessing.org/visuals/?visualID=9080 the ellipses for this shape : but i dont know how to do it, what is the best way to draw this form thanx !
	www.tweakingknobs.com&&&&Electronic Graphics and Computer Music

nardove Full Member Offline Posts: 189 UK	Re: How to do this shape ? Reply #1 - Apr 29^th, 2010, 8:58am I suggest bezierVertex(); http://processing.org/reference/bezierVertex_.html Cheers rS

PhiLho

Re: How to do this shape ?
Reply #2 - Apr 29^th, 2010, 10:28am

Code:

// Ratio for perfect circle
float pcr = 0.5522847498;

void setup()
{
  size(800, 550);
  smooth();
}

void draw()
{
  background(222);

  fill(0x8800EE00);
  stroke(#2288FF);
  DrawCircle(50, 50, 20);
  DrawCircle(110, 140, 80);
  DrawCircle(220, 350, 150);

  fill(0x880000EE);
  stroke(#22FF88);
  DrawShape(450, 50, 20);
  DrawShape(510, 140, 80);
  DrawShape(620, 350, 150);
  
  // Checking curvature
  fill(0x50EE0000);
  noStroke();
  DrawCircle(620, 350, 150);
}

// First step: draw a circle
void DrawCircle(float x, float y, float r)
{
  float l = (1 - pcr) * r;
  float d = 2 * r;
  // Assume here default CENTER mode
  x -= r; y -= r;

  beginShape();
  vertex(x, y + r); // Left
  bezierVertex(x, y + l,
	x + l, y,
	x + r, y); // Top
  bezierVertex(x + d - l, y,
	x + d, y + l,
	x + d, y + r); // Right
  bezierVertex(x + d, y + d - l,
	x + d - l, y + d,
	x + r, y + d); // Bottom
  bezierVertex(x + l, y + d,
	x, y + d - l,
	x, y + r); // Back to left
  endShape();
}

// Second step: change some sides
void DrawShape(float x, float y, float r)
{
  // Not sure why I have to increase l
  float l = 1.2 * (1 - pcr) * r;
  float d = 2 * r;
  // Assume here default CENTER mode
  // I put x and y to top-left
  x -= r; y -= r;

  beginShape();
  vertex(x + r, y); // Top
  vertex(x + d, y); // Top-Right
  vertex(x + d, y + r); // Right
  bezierVertex(x + d, y + r + l,
	x + r + l, y + d,
	x + r, y + d); // Bottom
  bezierVertex(x + r - l, y + d,
	x, y + r + l,
	x, y + r); // Left
  bezierVertex(x, y + r - l,
	x + r - l, y,
	x + r, y); // Back to Top
  endShape();
}

TweakingKnobs Full Member Offline Posts: 158	Re: How to do this shape ? Reply #3 - Apr 29^th, 2010, 11:41am awwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww.. some ! awesome man , thanx a mili 'on ! philho for president !
	www.tweakingknobs.com&&&&Electronic Graphics and Computer Music

Pages: 1

‹ Previous Topic | Next Topic ›