All posts by /r/processing

Can’t calculate arc’s

Hi friends,

Currently doing an assignment where we have to calculate fractions using Classes (this is our first time using them, so the code might appear really basic).

Here's the basic assignment: Fraction Class The fraction class represents a simple fraction (e.g 2 / 4) consisting of a numerator (2) and a denominator (4).

Data members: m_numerator(int) and m_denumerator (int) Constructor: The constructor has 2 arguments and initializes these data members. Methods: The display method has 4 arguments: float x, float y, float size, color fillColour. It draws the fraction as a portion of a rectangle and next to this as an arc. The size parameter (20px) indicates the size of one cell. Use a for-loop to display the rectangles. The getValue method returns the value of the fraction as a float. Main Application Now make 4 instances of the Fraction class giving each object different numerator and denominator values: Call the display method to display them below each other on the window as you can see in this screenshot. Also, show the sum of the fraction values. 

Here's my main tab:

Fraction f1, f2, f3, f4; void setup() { size(500, 200); f1 = new Fraction(1, 3); f2 = new Fraction(1, 4); f3 = new Fraction(3, 4); f4 = new Fraction(4, 10); textSize(15); } void draw() { background(120); f1.display(20, 20, 20, color(255)); f2.display(20, 50, 20, color(255)); f3.display(20, 80, 20, color(255)); f4.display(20, 110, 20, color(255)); fill(255); text("Sum of all fractions: " + (f1.getValue() + f2.getValue() + f3.getValue() + f4.getValue()), 20, 160); } 

And here's my class Fraction:

class Fraction { int m_numerator, m_denumerator; //Initializing data members. Fraction(int numerator, int denumerator) { m_numerator = numerator; m_denumerator = denumerator; } //Draw display containing the for-loops for te rectangle and the arc. void display(float posX, float posY, float size, color fillColour) { fillColour = color(245, 12, 12); rectMode(CENTER); //Draw the red inside for the numerator. for (int j=0; j<m_numerator; j++) { fill(fillColour); noStroke(); rect(posX+j*size, posY, size, size); } //Draw the white outline for the denumerator. for (int i=0; i<m_denumerator; i++) { noFill(); stroke(255); rect(posX+i*size, posY, size, size); } //Load the data type before the calculation. getValue(); //Draw an arc with the calculated value. fill(fillColour); stroke(255); arc(posX+m_denumerator*size+size*2, posY, size, size, -HALF_PI, getValue(), PIE); } //Get value from the fractions to calculate the sum. float getValue() { float value = m_numerator / m_denumerator; return value; } } 

Now for my problem: I can't seem to calculate getValue(). It doesn't matter where I put the calculation, or if I put it as a separate value, even if I hardcode the fraction it always gives me zero if I println() it. Can anyone point me in the right direction?

submitted by /u/Toverspreuk
[link] [comments]

Hyperlink – A Practical Model for Implementation?

I'm trying to build a Processing sketch which displays text, but then allows certain words to be clicked within this text in order to run some function which changes the text - a hyperlink, in not so many words.

However, it seems like this is a tricky problem with in-built Processing functionality, and I can't find a library that has already solved this problem. I'm not phobic of finding a solution myself, but if anybody knows of an existing, elegant solution, it would save me a lot of work!

At the moment, I'm pulling in a string from an external text file, allowing me to create .txt files which help me to organise my text blocks. I am trying to build a Link() class that displays text in a different colour, and has a step() functionality that allows it to be clicked on and then run some function. However, integrating this into the text string is proving quite difficult.

My fallback is to just give up, build the text in Twine and use Processing.js for the visual stuff!

submitted by /u/bonfiredog
[link] [comments]

Marker position detection on an image

Marker position detection on an image

Hi !

For a project I need to detect a specific kind of marker but I have no idea what they are called and thus don't know where to find documentation for such a thing.

My marker is kind of like a diamond/aruco marker but with a round shape (see photo).


Do you have any idea what is the name of this marker and maybe do you know a library that could detect it position in an image ?

Thank you a lot !

submitted by /u/Yarikim
[link] [comments]

Help With Color Changing.

My teacher is pretty terrible honestly but I have no choice but to take his class. We have been using processing to learn how to program in other languages. In the lab for this week he has asked me to make my "creature," which we have been working with since we began the class, change color as the mouse moves around (along with having the creature follow the mouse with trails and erasing when button is pressed). I have already figured out most of the lab because he went over these parts in class; however, he did not go over how to get an object to change color as I move it across the background. I don't know what to do to make this happen I would like a hint or suggestion to help me achieve this.

submitted by /u/Terok42
[link] [comments]

Beginner and desperate

This is probably a very easy fix but I want to change this so each line is a different and random colour... I if I try and randomize the stroke it makes all the lines the same colour but change every 2 seconds like a strobe light...... PLEASE HELP!!!

float lineY[] = new float[50];

float lineSpeed[] = new float[50];

void setup() {

size(500, 500);

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

lineY[i] = (i*1) * 10;

lineSpeed[i] = 5;



void draw() {


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

rect(i*10+5, lineY[i], 1, 100);

lineY[i] += lineSpeed[i];

if (lineY[i] < 0 || lineY[i] > height) {

lineSpeed[i] *= -1 ;




submitted by /u/remrem24
[link] [comments]

Some PNG images do not show up


I'm working on a chess game, so I downloaded svg images of the chess pieces and converted them to PNG. Some of them do not show up when I load them into processing and I don't know why. If anyone can tell me what I'm doing wrong, that would be great.

I'm using the python version btw.

def setup():



pawn_black = loadImage("pawn_black.png")

pawn_white = loadImage("pawn_white.png")

image(pawn_black, 0,0, 500, 500)

# this one does not work ^

#image(pawn_white, 0,0, 500,500) this one works


submitted by /u/PurelyCreative
[link] [comments]