Question

我无法在10000像素宽的窗口中移动透视图，其中我每隔毫秒左右执行一次绘图，并且所有图形都在x方向上堆叠。我希望能够沿着我想要的x轴移动屏幕上显示的视角，这样我就能看到实时绘图的发生。

我正在使用Arduino型板上的光传感器与PDE通信光线水平，我为每个光线读取实例绘制贝塞尔曲线，使光线昏暗时贝塞尔更宽，当光线强烈时，它会变窄。

我正在尝试实现此类型的导航栏：

    void setup()
{
  size(1800, 1800);
}

void draw()
{ int x_navigator = width / 2 - width / 6, y_navigator = 80, navigator_width = width / 3, navigator_height = 40;
  fill(204);
  rect(x_navigator, y_navigator, navigator_width, navigator_height);
  fill(250, 204, 0, 160);
  if (mouseX > x_navigator && mouseY > y_navigator && mouseX < x_navigator + navigator_width && mouseY < y_navigator + navigator_height)
  {
    if (mouseX < x_navigator + navigator_width / 12)
    {
      rect(x_navigator, y_navigator, navigator_width / 6, navigator_height);
    }
    else
    {
      if (mouseX > x_navigator + ((11 * navigator_width) / 12))
      {
        rect(x_navigator + (5 * navigator_width) / 6, y_navigator, navigator_width / 6, navigator_height);
      }
      else
      {
        rect(mouseX - (navigator_width / 12), y_navigator, navigator_width / 6, navigator_height);
      }
    }
  }
}

在我的代码上绘制了Beziers：

import processing.serial.*;

Serial Engduino;
String light_String = "", temperature_String = "";
int constant = 300;
float begin_x = 0, begin_y = 550, end_x, end_y, control = 1, light, temperature;

    void setup()
    {
      String portName = "COM3";
      Engduino = new Serial(this, portName, 9600);
      size(1000, 800);
      noFill();
      smooth();
      strokeWeight(3);
    }

    void draw()
    {
      if (Engduino.available() > 0) 
      {
        light_String = Engduino.readStringUntil('\n');
        try{light = parseFloat(light_String);}
        catch(NullPointerException e)
        {;}
        println("The light is: ");
        println(light);
        end_x = begin_x + (400 / (sqrt(light) + 1));
        end_y = begin_y - constant;
        control = end_x - begin_x;
        bezier(begin_x, begin_y, begin_x + control, begin_y, end_x - control, end_y, end_x, end_y);
        constant = constant * (-1);
        begin_x = end_x;
        begin_y = end_y;
      }
    }

虽然可以将显示的图像移动到光标所在的位置，但我可以实时查看图形，还可以检查以前绘制的曲线。

编辑：所以没有Engduino的代码是这样的：

int constant = 300;
float begin_x = 0, begin_y = 550, end_x, end_y, control = 1, light = 30; // Light is what I get through the serial port from the Engduino (an Arduino type board`)

void setup()
{
  size(10000, 800); // The 10000-pixel wide window.
  noFill();
  smooth();
  strokeWeight(3);
}

void draw()
{
    end_x = begin_x + (400 / (sqrt(light) + 1));
    end_y = begin_y - constant;
    control = end_x - begin_x;
    bezier(begin_x, begin_y, begin_x + control, begin_y, end_x - control, end_y, end_x, end_y);
    constant = constant * (-1);
    begin_x = end_x;
    begin_y = end_y;
}

我想要的是有一个I型导航栏（至少在设计中）可以在10000像素宽的窗口中导航。我上传的导航条形码只是导航的一种设计，没有任何功能，我想要一些帮助。

Answer 1

这会有点复杂，因为您的绘图是在多个帧上完成的。你不是每一帧都清理画布，而是随着时间的推移建立一幅画。

如果要清除画布并重新绘制每个帧的所有内容（这是许多Processing草图所做的事情），那么您只需更改绘制所有内容的X值，或者只需调用{{ 1}}在绘制其他所有内容之前的功能。

但是，由于您要在多个帧上绘制所有内容，因此您将不得不绘制到translate()缓冲区。然后在每个帧上，使用您想要的任何X偏移绘制缓冲区。这是一个小例子：

PGraphics

处理中的导航栏大于屏幕绘制

1 个答案: