javascript - Box2d.js与Processing.js

最近，我通过结合Processing.js和Box2D.js库进行了一些整洁的基于浏览器的模拟，从而进一步增强了对Javascript的了解。

根据我目前的想法，我试图让用户单击并拖动一个形状，然后在释放鼠标后放下它。到目前为止，我已经能够弄清楚如何使用b2MouseJoint对象使用mouseX / mouseY坐标来操纵物体，但是并不能完全发挥作用。

单击形状时发生的所有事情都是将其固定并围绕单击时当前的mouseX / mouseY点旋转。

void mousePressed(){
     for(int i = 0; i < circles.size(); i++){
        //Get body objects from ArrayList
        var obj = circles[i];

        // Retrieve shapes from body
        var innerShape = obj.GetShapeList();
        var rad = innerShape.m_radius;

        // Create mouseJoint and add attributes
        var mouseJoint = new b2MouseJointDef();
        mouseJoint.body1 = world.GetGroundBody();

        // Detect body
        if(dist(mouseX,mouseY,obj.m_position.x,obj.m_position.y) < rad){
           Vec2 p = new b2Vec2(mouseX,mouseY);

           mouseJoint.body2 = obj;

           mouseJoint.target = p;
           mouseJoint.maxForce = 10000.0f * obj.GetMass();
           mouseJoint.collideConnected = true;
           mouseJoint.dampingRatio = 0;
           mouseJoint.frequencyHz = 100;
           world.CreateJoint(mouseJoint);
        }
   }
}

因此，基本上我的问题是，如何编写该文字，以便在按住鼠标时，主体/形状遵循鼠标的坐标，而不仅仅是将形状固定到位。

干杯

最佳答案

基本上，您所需要做的就是将现在使用的代码添加到mousePressed中，将坐标设置为mouseDragged（）方法，因为这是在使用一个或多个按钮移动鼠标时调用的事件方法郁闷：

void mouseDragged()
{
  // update obj with mouseX and mouseY in this method
}

您可能还想通过在mousePressed（）期间设置“初始点击”标记变量，在mouseDragged（）期间更新一组“偏移”变量并将偏移量提交给mouseReleased（）来进行更多管理。您可以执行诸如回复到原始位置等操作。