Hi there,
My animator set up physics for a piece of clothing in Spine editor and I can see the physics working there:
But when I use spine-webgl to display it on the website, there is no physics animation:
Here is an example of a different pose, where physics is correctly happening in the editor:
But in web it looks like this. Looks like there is some movement it's stiff and it's not waving in the same way that it is in the editor:
Any idea how to fix this?
Thanks
It seems like the physics animation is not being applied correctly when using spine-webgl. Here are a few steps you can take to troubleshoot and potentially resolve the issue:
Check the Spine Editor Version and Runtime Version: Ensure that the version of the Spine editor you used to create the animations matches the version of the spine-webgl runtime you are using. For example, if you exported the animations using Spine editor 4.1, you should use the 4.1 runtime.
Preview in Skeleton Viewer: Verify if the physics animation works correctly in the Skeleton Viewer. The Skeleton Viewer uses the reference runtime, spine-libgdx. If it works there but not in spine-webgl, then there may be a problem in spine-ts/spine-webgl.
Export Settings: Double-check your export settings in the Spine editor to ensure that all necessary data for physics is being exported correctly.
Warm Up Setting: Physics are dynamic and may not loop perfectly like keyed animations. You can make it more likely for your physics to loop seamlessly by setting the "warm up" to 1 or more in the Spine editor.
Implementation Code: If the above steps do not resolve the issue, there might be a problem with the implementation code. Ensure that the code correctly initializes and updates the physics in the spine-webgl runtime.
If the problem persists, you might need to provide more details about your implementation or share a minimal reproducible example to further diagnose the issue.
I fixed the issue
update(canvas, delta) {
this.animationState.update(delta);
this.animationState.apply(this.skeleton);
this.skeleton.update(delta); // i was missing this line
this.skeleton.updateWorldTransform(Physics.update);