Cannonjs glitch while moving body

331 Views Asked by At

I have an issue with character movement in cannonjs and maybe some one can give me a hint.

the issue: enter image description here

As you can see, there is a visual glitch when character moves.

In cannonjs world I have a plane as a floor and sphere as the character representation.

On keyboard input I move body:

this.body.velocity.x += inputVector.x * dt * MAX_VELOCITY
this.body.velocity.z += inputVector.z * dt * MAX_VELOCITY

On update I copy position from body to mesh:

this.world.step(1 / PHYSICS_FRAME_RATE, dt, 3)

this.objects.forEach(({ body, wireframe }) => {
  if (wireframe) {
    wireframe.position.copy(toThreeVec3(body.position))
  }
})

I have a basic world setup

  public defaultMaterial = new Material('default')
  public defaultContactMaterial = new ContactMaterial(
    this.defaultMaterial,
    this.defaultMaterial,
    {
      friction: 0.0,
      restitution: 0.3,
    },
  )

  //...

  this.world = new World()
  this.world.gravity.set(0, -9.81, 0)
  this.world.broadphase = new SAPBroadphase(this.world)
  this.world.allowSleep = true

  this.world.addContactMaterial(this.defaultContactMaterial)
  this.world.defaultContactMaterial = this.defaultContactMaterial

  this.world.defaultContactMaterial.contactEquationStiffness = 1e9
  this.world.defaultContactMaterial.contactEquationRelaxation = 4

I get the dt like this:

const elapsedTime = this.clock.getElapsedTime()
const dt = elapsedTime - this.previousTick
this.previousTick = elapsedTime

And just to be secure, versions of libs: package.json

"cannon-es": "^0.17.1",
"three": "^0.129.0",

I have suspicions that there are two places that can cause this glitch:

  1. Main thread overload: I have a lot of textures, videos and also few gltf files. This massive asset in addition to cannonjs causes a frame drop. I moved all physics related stuff to webworkers and ... overall performance is better but glitch is still there. So, the issue is not here.

  2. Moving body in cannonjs While googling I found in babylonjs forum that O=I should never change the position of body but instead apply a force on it. Do I need to behave same with velocity? I mean, maybe it's wrong to change velocity value but instead I need to apply force to move body. I checked cannonjs/es examples and they do change velocity. So, the issue is also not here.

Any ideas?

0

There are 0 best solutions below