Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

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

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!!

over 4 years ago · Santiago Trujillo
2 Respuestas
Responde la pregunta

0

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;
}
over 4 years ago · Santiago Trujillo Denunciar

0

Instead of creating a line and having to remember the previous point you could use the createShape() function provided by processing. To doc has some good examples.

The idea is to start your shape with s = createShape() before you start the loop which calls updateWave() in draw(). Then in updateWave() instead of creating a circle() you will create a new s.vertex() in the shape.

When you are out of the loop you can call s.endShape() and you can then call shape(s) to draw the shape created by these points.

over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda