Processing 1.0 - Processing Discourse - how to make gradient ellipse?

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 make gradient ellipse

‹ Previous Topic | Next Topic ›

Pages: 1

how to make gradient ellipse? (Read 5176 times)

indacome YaBB Newbies Offline Posts: 13	how to make gradient ellipse? Aug 5^th, 2007, 7:47pm Hello. I am just beginner to use the processing. I just wonder how to fill the gradient effect into a shape i make. for example, if i draw ellipse how can i fill the gradient blend color? or shape that made of vertex? anyone can help me?

antiplastik YaBB Moderator Offline Posts: 699 France	Re: how to make gradient ellipse? Reply #1 - Oct 1^st, 2007, 5:34pm Hi. You can do it in OpenGL. I don't know if it works with ellipses, but have a look to this example : http://processing.org/learning/3d/rgbcube.html Nicolas

toxi

Re: how to make gradient ellipse?
Reply #2 - Oct 1^st, 2007, 5:57pm

here's one I made earlier, should be fairly self-explanatory:

Code:

import processing.opengl.*;

void setup() {
  size(400,400,OPENGL); 
}

void draw() {
  float animRadiusY=50+50*abs(sin(frameCount*0.05));
  drawGradientDisc(
    mouseX,
    mouseY,
    50,
    animRadiusY,
    color(255,0,255),
    color(0,0,0,10)
  );
}

void drawGradientDisc(float x,float y, float radiusX, float radiusY, int innerCol, int outerCol) {
  noStroke();
  beginShape(TRIANGLE_STRIP);
  for(float theta=0; theta<TWO_PI; theta+=TWO_PI/36) {
    fill(innerCol);
    vertex(x,y);
    fill(outerCol);
    vertex(x+radiusX*cos(theta),y+radiusY*sin(theta));
  }
  endShape();
}

postspectacular.com | toxi.co.uk

indacome YaBB Newbies Offline Posts: 13	Re: how to make gradient ellipse? Reply #3 - Oct 3^rd, 2007, 2:36pm thank you for give me good example. It is good example for me. however i still wonder how to make the liner gradient in ellipse or oval shape? I try to make it couple of time but i didn't work. Can you share your expertise to slove this problem.

fjen

Re: how to make gradient ellipse?
Reply #4 - Oct 3^rd, 2007, 5:08pm

Code:


import processing.opengl.*; 

void setup() { 
    size(400,400,OPENGL);  
} 

void draw() { 
    float animRadiusY=50+50*abs(sin(frameCount*0.05)); 
    drawLinearGradientDisc( 
    mouseX, 
    mouseY, 
    50, 
    animRadiusY, 
    color(255,0,255), 
    color(0,0,0,10) 
	  ); 
} 

void drawLinearGradientDisc( float x, float y, float radiusX, float radiusY, int fromC, int toC )
{ 
    noStroke(); 
    beginShape(TRIANGLE_STRIP);
    int halfC = lerpColor(fromC,toC,0.5);
    
    for(float theta=0; theta<TWO_PI; theta+=TWO_PI/36)
    { 
	  fill(halfC);  
	  vertex(x,y);
	  if ( theta <= PI )
		fill(lerpColor(fromC, toC, (theta%PI)/PI ));
	  else
		fill(lerpColor(toC, fromC, (theta%PI)/PI ));
	  vertex(x+radiusX*cos(theta),y+radiusY*sin(theta));
    } 
    endShape(); 
}

something like this?
F

indacome YaBB Newbies Offline Posts: 13	Re: how to make gradient ellipse? Reply #5 - Oct 4^th, 2007, 12:44am thank you Fjen and toxi. I saw the toxi's exhibition in the Exhibition menu. In the exhibition, the face have the liner graident that i want to make. Your code help me a lot. I still wonder how to combine gradient code and mutiform shape. Thank for your time

antiplastik

Re: how to make gradient ellipse?
Reply #6 - Oct 9^th, 2007, 6:07pm

you can try this pure java2D code, but as said here there is no support for this kind of method.

Code:


Graphics2D g2 = ((PGraphicsJava2D)g).g2;
java.awt.GradientPaint redtowhite = new java.awt.GradientPaint(0, 0, new java.awt.Color(255, 0, 0),100, 0, new java.awt.Color(255, 255, 255));
g2.setPaint(redtowhite);
g2.fill(new java.awt.geom.Ellipse2D.Double(0, 0, 100, 50));

dickbird YaBB Newbies Offline Posts: 6	Re: how to make gradient ellipse? Reply #7 - Oct 13^th, 2009, 6:27pm Awesome! Thank you for making this and making it available.

Pages: 1

‹ Previous Topic | Next Topic ›