ProcessingJS物理模拟中的惯性和重力不准确

Question

所以，我正在尝试在 Processing JS 中进行基本的物理模拟。我希望用户能够通过拖动来控制球。他们应该能够移动它并通过释放它将其抛向空中。没有其他任何东西，只有这些东西，当然还有画布周围的墙壁，我可以轻松地自己编程。我在动量和重力方面遇到了一些问题，我找不到一个很好的方法来处理我正在使用的当前系统。

我已经尝试过使用 pmouseX 和 mouseX 以及 Y 轴的对应项。但是，如果用户按下屏幕并四处移动，它会重置球的加速度和速度。我在mouseDragged() 函数中完成了所有这些工作。接下来，我尝试在拖动完成时使用mouseReleased 函数执行这些操作，但这不起作用，因为它检测到所有点击并重置加速度和速度，或者将它们设置为高得离谱的数字。对于这两种情况，我也遇到了阻力、空气阻力和摩擦的问题。我不能轻易地将它们与现有的代码和重力结合起来。到目前为止，我一直在使用 PVector 来表示速度。

我已经完成了这两种方法的某种组合，这就是我目前所拥有的。

int x = 150;
int y = 150;
PVector v;
v = new PVector(0,0);
int pmousex2 = 0;
int pmousey2 = 0;
void draw() {  // this is run repeatedly.  
    background(255,255,255);
    x += v.x;
    y += v.y;
    v.set((v.x/1.0125), ((v.y/1.0125)+3));
    ellipse(x,y,12,12);
    pmousex2 = pmouseX;
    pmousey2 = pmouseY;
    if (y>294){
        v.set((v.x/1.5),(((-1*v.y)/1.5)));
    }
    if (y<6){
        v.set((v.x/1.5),(((-1*v.y)/1.5)+3));
    }
    if (x>294){
        v.set(((-1*v.x)/1.5),v.y);
    }
    if (x<6){
        v.set(((-1*v.x)/1.5),v.y);
    }
}
void mouseReleased(){
    if (mouseX>(x-20) && mouseX<(x+20) && mouseY>(y-20) && mouseY<(y+20)){
        v.set((pmouseX - pmousex2)/4, (pmouseY - pmousey2)/4);
    }
}
void mouseDragged(){
    if (mouseX>(x-20) && mouseX<(x+20) && mouseY>(y-20) && mouseY<(y+20)){
        x=mouseX;
        y=mouseY;    
    }
}

我遇到了几个问题，尤其是上面描述的那些。我也遇到过球在拖动时移动很小的情况。最后，主要问题。当重力将球向下拉时，我无法让球静止不动。如果我加强重力，球最终会从地板上掉下来。如果我削弱重力，球就永远不会停止弹跳。我想知道是否有一种不同的方法来解决我还没有想到的这个问题。非常感谢。

Answer 1

关于最后一个主要问题。最常见的方法是根据重力矢量对球的速度和位置进行矢量加法：

let canvas
let pos
let ground
let gravity
let speed

function setup() {
  canvas = createVector(500,500)
  pos = createVector(200,150)
  ground = createVector(0,470)
  gravity = createVector(0,2.5)
  speed = createVector(0,0)
  createCanvas(canvas.x,canvas.y)
}

function draw() {
    // update
    speed.add(gravity)
    pos.add(speed)
    if (pos.y >= ground.y - 8) {
      pos.y = ground.y - 8
      if (speed.mag() > 3.0) {
        speed.mult(-1)
      }
      else {
        speed = createVector(0,0)
        gravity = createVector(0,0)
      }
    }
    // draw
    background(200,200,220)
    fill(170, 100, 50);
    noStroke();
    rect(0,ground.y,canvas.x,canvas.y-ground.y)
    stroke(50)
    fill(100, 150, 150);
    ellipse(pos.x,pos.y,16,16)
}

function mouseReleased(){
    speed = createVector(0,0)
    gravity = createVector(0,2.5)
    pos.set(mouseX, mouseY)
}

DEMO

因此，使用这种方法，您将习惯矢量代数运算，这在计算机图形开发中需要很多，并且您的解决方案将最符合运动学定律。