Question

我想在Processing草图中放大鼠标光标下的点。问题的规模部分非常简单;这是我无法弄清楚的翻译部分。我们的想法是能够放大到Processing草图，同时保持草图中对象之间的相对距离。

非常感谢任何帮助。放大但不保持相对距离的基本草图如下：

float scaleFactor;

void setup()
{
  size(300, 300);

  scaleFactor = 1;
}

void draw()
{
  background(255);

  fill(128);

  noStroke();

  pushMatrix();

  scale(scaleFactor);

  rect(0, 0, 100, 100);

  popMatrix();
}

void keyPressed()
{
  if (key == 'r')
  {
    scaleFactor = 1;
  }
}

void mouseWheel(MouseEvent e)
{
  scaleFactor += e.getAmount() / 100;
}

Answer 1

之前的回答并没有完全符合要求的行为。例如，如果您想要在Google地图中滚动鼠标所需的缩放方式，我认为您想要这样：

float scaleFactor = 1.0;
float translateX = 0.0;
float translateY = 0.0;

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

void draw() {
  background(255);

  fill(128);

  noStroke();

  pushMatrix();

  translate(translateX,translateY);
  scale(scaleFactor);

  rect(0, 0, 100, 100);
  rect(width-100, height-100, 100, 100);

  popMatrix();
}

void keyPressed() {
  if (key == 'r') {
    scaleFactor = 1;
    translateX = 0.0;
    translateY = 0.0;
  }
}

void mouseDragged(MouseEvent e) {
  translateX += mouseX - pmouseX;
  translateY += mouseY - pmouseY;
}

void mouseWheel(MouseEvent e) {
  translateX -= mouseX;
  translateY -= mouseY;
  float delta = e.getCount() > 0 ? 1.05 : e.getCount() < 0 ? 1.0/1.05 : 1.0;
  scaleFactor *= delta;
  translateX *= delta;
  translateY *= delta;
  translateX += mouseX;
  translateY += mouseY;
}

Answer 2

试试这个......

float scaleFactor;
float translateX;
float translateY;
void setup()
{
  size(300, 300);

  scaleFactor = 1;
}

void draw()
{
  background(255);

  fill(128);

  noStroke();

  pushMatrix();

  translate(translateX,translateY);
  scale(scaleFactor);

  rect(0, 0, 100, 100);
  rect(width-100, height-100, 100, 100);

  popMatrix();
}

void keyPressed()
{
  if (key == 'r')
  {
    scaleFactor = 1;
  }
}

void mouseWheel(MouseEvent e)
{
  translateX = translateX-e.getAmount()*(mouseX)/100;
  translateY = translateY-e.getAmount()*(mouseY)/100;
  scaleFactor += e.getAmount() / 100;
}

Answer 3

实际上，这样做更轻松：

float e = -event.getCount()/100.0;
float delta = pow(2, e);

代替：

float delta = e.getCount() > 0 ? 1.05 : e.getCount() < 0 ? 1.0/1.05 : 1.0;

如何放大鼠标光标下的点（处理）

3 个答案: