A Processing precision problem?

The code example below inscribes a circle within a square.
In the result however, the circle is moved one point up and one point left, relative to the square.
Check the picture: The borderless circle is tipping over the center of the left and up boundaries of the square, while staying clean of the right and bottom ones.

I tried to change the radius and the center, to use rounded coordinates, etc. yet the effect persists.

Q: Am I doing anything wrong? Otherwise how to address this issue “cleanly”?

The code:

size (500,500);

PVector center = new PVector(width/2,height/2);
float radius = 200;

rectMode(RADIUS);
ellipseMode(RADIUS);

fill(#EEEEEE);
strokeWeight(1);
rect(center.x,center.y,radius,radius);

noStroke();
fill(#FFFFFF);
circle(center.x,center.y,radius);

stroke(0);
line(center.x-250,center.y,center.x+250,center.y);
line(center.x,center.y-250,center.x,center.y+250);

The effect:

Hello,

This example may help:

size (500, 500);

float dia;

PVector center = new PVector(width/2, height/2);

// Try ones of these 4 at a time:

// 1 left + top
dia = 400;
smooth(3);  //default

// 2 ok
//dia = 400;
//noSmooth();

// 3 ok
//dia = 401; 
//smooth(3);  //default

// 4 right + bottom
//dia = 401; 
//noSmooth();

rectMode(CENTER);
ellipseMode(CENTER);

fill(#EEEEEE);
strokeWeight(1);
rect(center.x, center.y, dia, dia);

noStroke();
fill(#FFFFFF);
circle(center.x, center.y, dia);

stroke(0);
line(center.x-250, center.y, center.x+250, center.y);
line(center.x, center.y-250, center.x, center.y+250);

I have had these issues before and have to adjust to lining up to pixels sometimes.

You can also try another renderer with your code:
https://processing.org/reference/size_.html

See the references about smooth() and noSmooth():
https://processing.org/reference/noSmooth_.html
https://processing.org/reference/smooth_.html

This also seemed to work with your original code:
float radius = 200.5;

I do not have a definitive solution and was experimenting a bit.

I suspect it is related to smoothing and anti-aliasing.

:)

2 Likes

glv, I appreciate the quick, detailed and experimented reply.
Like you, I suspect it is an artifact of the renderer. Thanks to your suggestion, it’s proven: Using “size(500,500,P3D)” does avoid the artifact, at least in the original case. Now I know it’s not my fault :slight_smile:
Thank you!

1 Like