如何放大到鼠標光標下的點（處理）

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

嘗試......

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 2

以前的答案不相當有要求的行爲。例如，如果您希望使用與用戶在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; 
}