处理（Java）：当函数的幅度增加时，如何使绘制的正弦函数看起来是连续的而不是单独的点

Posted 2023-04-13

【中文标题】处理（Java）：当函数的幅度增加时，如何使绘制的正弦函数看起来是连续的而不是单独的点

【英文标题】：Processing (Java): How to make a plotted sine function look continuous instead of separate dots when the amplitude of the function increases

【发布时间】：2021-03-03 19:44:10

【问题描述】：

我通过在函数中放置 x 个像素，在 Processing 中绘制了一个正弦波。乍一看像是一条连续的线：

Sine wave looks continuous

但是当我增加波的幅度时，我注意到绘制的点散开了，看起来不再连续：

Sine wave with increased amplitude where the points are spread

我认为在点之间绘制更多点或插值可能会解决问题。我想知道对于幅度或频率的任何增量，使函数看起来连续的最有效方法是什么。

如果它有任何帮助，这里是处理中的代码：

// 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;
  
  

谢谢！！

【问题讨论】：

你可以在前一点和当前点之间画一条线。

【参考方案1】：

在 2 个连续点之间画一条线 (line())，而不是单个点 (circle())。线的粗细可以通过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;

【参考方案2】：

您可以使用处理提供的createShape() 函数，而不是创建一条线并记住前一点。 To doc 有一些很好的例子。

这个想法是在你开始循环之前用s = createShape()开始你的形状，在draw()中调用updateWave()。然后在 updateWave() 中，而不是创建 circle()，您将在形状中创建一个新的 s.vertex()。

当您退出循环时，您可以调用s.endShape()，然后您可以调用shape(s) 来绘制由这些点创建的形状。