Rendering issues drawing primitives with stroke()

I am experiencing rendering issues when I try to draw lines between sub-pixel positions (i.e., specifying start-end-coordinates using float values). Lines drawn with a regular interval using a for loop should appear evenly spaced, however, they seem to be rounded to the nearest integer value causing them to appear in irregular patterns. This happens in all renderers (JAVA2D, P2D, FX2D) using Processing 3.3.7 on OSX 10.12.6.

Also, other users have noticed this and described the problem along with a suggested workaround (drawing lines using rect()): https://forum.processing.org/one/topic/why-does-rect-look-better-than-line.html

Before filing an official bug, I wonder if anyone has dug deeper into the possible reason to why this is happening? I consider smooth rendering of sub-pixel lines to be an absolutely essential part of Processing. Why hasn’t his been resolved yet?

I don’t have much smart to say about the issue, but another workaround I could suggest is to make a new PGraphics of vertical width in pixels equal to double the amount of lines you want to draw - so then you draw a line on every odd vertical row of the PGraphics, and then draw that PGraphics scaled where you want instead of the lines. That is a bit hacky, but would probably help.

If nobody has ever filed an issue about this then it might not even be on the radar for the devs. You should definitely search issues on stroke and file one if it doesn’t exist – that previous thread is illuminating; I wasn’t aware if it.

i see also a issue with triangles WITHOUT stroke
pls. see:

// render 2 triangles 
// without stroke, see a diagonal line possibly a stroke calc error
// with stroke and stroke > 1 see "snake tongue"

PVector p1, p2, p3, p4, pm;
float w = 80;
boolean showstroke = false;

void setup() {
  size (200, 200); 
  p1 = new PVector(w, w);
  p2 = new PVector(2*w, w);
  p3 = new PVector(w, 2*w);
  p4 = new PVector(2*w, 2*w);
  pm = new PVector(mouseX, mouseY);
  println(" key [s] toggle stroke , mouse click move p3");
}

void draw() {
  background(0, 255, 0);
  pm.set(mouseX, mouseY);
  fill(0, 0, 200);
  if ( showstroke ) { 
    stroke(200, 0, 0); 
    strokeWeight(3);
  } else { 
    noStroke();
  }
  triangle(p1.x, p1.y, p2.x, p2.y, p3.x, p3.y);
  triangle(p2.x, p2.y, p3.x, p3.y, p4.x, p4.y);
}

void keyPressed() { 
  if ( key == 's' ) showstroke = !showstroke;
}

void mousePressed() { 
  p3 = pm.copy();
}


snap-017

snap-018

Was a bug report ever filed on this?

I have been bothered by this issue for many years, and i also chipped in when it was discussed in that old thread you linked. And for the record, the dates on that thread are not correct. My reply is labeled as 4 months old, while in fact it’s 6 years and 4 months old, from 2013.

This is such an old problem, i’ve basically just learned to live with it. I always use custom line functions that employ rotate() and rect(). I’m currently considering writing a custom ellipse function too, by editing the pixels[] array. It remains to see how the performance will compare, but at least it will be precise.

1 Like