Pie Chart Wedge Colors

Programming Questions

jhsizemore

in Programming Questions • 2 years ago

I want a pie chart with two values and I've started with a modified version of the pie chart example on processing.org

When I used the online processing.js editor, the color differentiation showed up, except when the values are 50/50 and they become the same color.

However, when I place this code in the standard processing editor on my computer, I get a circle of a solid color.

Is it possible to give each wedge a defined color? That would be easiest. But looking from how it's drawn I don't see how that can be done.

Here is the code I'm using:

size(200, 200);

background(255);

smooth();

noStroke();

int players = 16;

int humans = 8;

int diameter = 150;

int[] angs = {humans/players*100, 0, 0, 0, 100-humans/players*100};

float lastAng = 0;

for (int i = 0; i < angs.length; i++){

fill(angs[i] * 3.0);

arc(width/2, height/2, diameter, diameter, lastAng, lastAng+radians(angs[i]*3.6));

lastAng += radians(angs[i]*3.6);

}

Replies(4)

rolher

simply change the type of human, player and angs[] form int to float. If you use int instead of float human / players = 0 and not what you expect 0.5. (it's about static data typing in java, one of the differents to javascript).

jhsizemore

Re: Re: Pie Chart Wedge Colors

2 years ago

I get the feeling that it isn't just about changing from int to float, but then doing something from there. As I'm pretty new to Processing I don't really know what that next move might be.

Also, because I'm going to be pulling in XML data, I have switched to using an "active" status (If I understand the lingo correctly)

float players = 16;

float humans = 8;

XMLElement xml;

void setup() {

size(200, 200);

background(255);

smooth();

}

void draw(){

int diameter = 150;

float[] angs = {humans/players*100, 0, 0, 0, 100-humans/players*100};

float lastAng = 0;

for (int i = 0; i < angs.length; i++){

fill(angs[i] * 3.0);

arc(width/2, height/2, diameter, diameter, lastAng, lastAng+radians(angs[i]*3.6));

lastAng += radians(angs[i]*3.6);

}

When I run this, I still get just a gray circle. Thoughts?

jeff_g

Re: Pie Chart Wedge Colors

2 years ago

You'll want to have your background(255); specified in the draw. Otherwise, it seems to be a problem with the arc. Change your fill to something random and you'll see it fill(random(0,255));

jhsizemore

Re: Re: Pie Chart Wedge Colors

2 years ago

I ended up figuring out that, because I'm only using 2 wedges, I can draw just one wedge on top of a solid circle and give them the colors I want. Problem solved.

Thanks.

Top Reply