Processing (Java): How to make a plotted sine function look continuous instead of separate dots when the amplitude of the function increases

Question

I have plotted a sine wave in Processing by putting x amount of pixels in the function. It looks like a continuous line at a first glance:

Sine wave looks continuous

But when I increase the amplitude of the wave, I notice that the plotted dots spread out and it doesn't look continuous anymore:

Sine wave with increased amplitude where the points are spread

I thought that plotting more points or interpolation between the points might solve the problem. I was wondering what would be the most efficient way to make the function look continuous for any increment of the amplitude or frequency.

If it helps in any way, here's the code in Processing:

// sine variables
float x, y, y2, offset,r = 0;
float ex = 0, ey = 0; 
 
void setup() {
  size(800, 800);
  frameRate(60);
}
 
void draw() {
  // sine
  checkMouse();
  amp = amp+ex;
  background(0);
  y2 = y;
  stroke(255);
  for (int i = 5; i < 6;i++) {
  updateWave(i);
  }
}

void updateWave(float i) {
  for (int x = 1; x < width; x+=1) {
  y = sin(radians(-x*abs(ex)+r))*ey*i;
  circle(x, y+height/2,2);
  }
  r = millis()/8;
}

void checkMouse() {
  if (mousePressed){
    ex = (mouseX - height/2)*0.01;
    ey = pow((mouseY- height/2), 2)/1000;
  } else {
    if (ey < 1) {
    ey = 0;
  } else {
    ey -= 1;
  }
  }
}

Thanks!!

Answer 1

Draw a line (line()) between 2 consecutive points rather than single dots (circle()). The thickness of a line can be set by strokeWeight():

void updateWave(float i) {
    strokeWeight(2);
    float prevY = 0.0;
    for (int x = 0; x < width; x ++) {
        float newY = sin(radians(-x*abs(ex)+r))*ey*i + height/2;
        if (x > 0)
            line(x-1, prevY, x, newY);
        prevY = newY;
    }
    r = millis()/8;
}