物體控制鼠標相對於圓圈的位置

Question

需要一些靈感。我有一張照片（藍色），並希望它在一個不可見區域（橙色）內與鼠標位置成比例移動。所以，如果鼠標向左上方移動，圖像應該跟隨移動。

我不想簡單地複製鼠標位置，而是創建一個類似於操縱桿的行爲，所以如果鼠標移動，圖像應該按照所需的方向逐步移動。

但是如何？我不知道如何爲圖像設置正確的x + y座標，或者如何建立公式來計算它們。

Answer 1

增量（矢量）的位置。考慮：

• 我們稱您的看不見的圓的死點爲矢量參考點（0,0）或VRP。

• 您將鼠標從VRP移開。讓我們用你的圖片作爲參考，並說你的鼠標相對於VRP在（-3x -2y）。你把它保留在那裏;它創建一個-3 X向量和一個-2 Y向量。

• 因爲只要你保持你的鼠標在那裏，這些矢量將被應用到廣場的當前座標，在每個週期中，像這樣：

  • 假設圖片首發位置是絕對的100,100。
  • 週期1：[x]：100-3 = 97; [Y]：100-2 = 97。新圖像位置= 97x98y。
  • 週期2：[x]：97-3 = 94; [Y]：98-2 = 96。新圖像位置= 94x96y。

等等。如果您想停止移動，請將光標移回VRP。

您可能會創建加速度中間矢量的機制，或矢量參考點周圍的死區。