GLB Model with Animations Doesn't Load in Model Viewer, But Works in Babylon Viewer?

[samdelara]

Description

I am having issues loading a GLB model with animations into the model viewer. When loading the model, it is just a white screen with nothing on it.

The warning error that was shown here does mention that there is a node with a skinned mesh that is not root, but that shouldn't be causing this type of issue in the model viewer.

When I take that same exported GLB into another model viewer, like Babylon, then the model appears as expected with the animation playing properly.

For reference, here are the components of the model within Blender:

When I place the model in another Google product like Google Poly, then the viewer is also initially blank, but when zoomed out, we start to see a large version of the model that is then clipped by the camera.

When launched in AR, this model similarly looks huge in comparison to what it should be in a normal viewer.

This is very strange that a viewer like Babylon was able to interpret the GLB correctly, but the model viewer here looks like it is either picking up a lingering default pose of the model, or just breaking a connection within the rig, which then breaks the model.

Browser Affected

• [ X ] Chrome

OS

• [ X ] Android

[elalish]

Interesting. I would take those validator warnings pretty seriously. Can you update the model to fix that? Also, recall that glTF specifies that units are meters, so you've probably exported this in mm or something, which is why it looks huge. Also, we set our camera based on the resting pose of the model, so make sure you animation isn't applying some crazy scale or translation.

[samdelara]

@elalish Do you have another recommendation as to how I can fix that issue on the model if the units are correct already and there are no crazy scale or translation components in the animation too?

[elalish]

I don't know the authoring tools like Blender well, so I won't be much help. The only way I or anyone else will be able to debug is if you give us a link to a demo URL so we can download your model. Have you tried in the three.js editor? If it repros there, then you may want to open a bug in three.js (since that's what we're built on).

[samdelara]

@elalish I can confirm that this model was created in meters and that there shouldn't be anything upscaling it to the degree that it is. In other viewers, the model looks exactly as expected and doesn't get blown up.

I cleared other earlier errors by exporting out only joints that were being used by the mesh. This outstanding error I have pictured was considered a semantic issue in the documentation and leads to only a warning flag vs an error flag. The warning itself also mentions that the parent transforms would not affect the skin mesh, which leads me to believe that it would cause something in my rig to not move vs. move at all, which is not the issue I've been encountering.

I'm happy to help clear that error, but the Blender file that the model is in is clean, so it's confusing where this issue is coming from since Google model viewer is where I'm having issues with it.

Here are my current export settings as well:

Any additional help would be appreciated!

[anakin2022]

[elalish]

@donmccurdy Do you know what the cause of this "Skinned mesh non-root" warning is? Should we consider this a three.js import bug or a Blender export bug? Do you know of any way to work around it?

[donmccurdy]

NODE_SKINNED_MESH_NON_ROOT is a warning about the content of the glTF model. Nesting a skinned mesh under another node in the scene hierarchy will trigger this warning, and unnesting before exporting from Blender should fix it. If the parent node(s) do not have any transforms, the warning is harmless. If they do have transforms, the warning may indicate unexpected behavior since different engines could have different effects when both the armature and the skinned mesh have (conflicting) transforms.

Similar bugs (model not centered in viewport) may also be result of issues like #2450, causing the model's bounds to be incorrectly estimated.

[garyiskidding]

@samdelara : Can you advise if this solved your problem? I face a similar problem where the file works in babylon.js but not in modelviewer.

[anakin2022]

I add to this problem. In modelviewer it loads the animation in preview mode but when I enter AR mode - augmented reality, the animation does not load and only shows the stopped object, I have generated the animations with mixamo.com.

In blender they don't look like errors to me, it seems that it is the way mixamo creates the armature and the way it animates the mesh.

I attach images and I attach blender and fbx files. Hopefully we will find a solution.

I don't have advanced knowledge at that level to see what else I could do.

[elalish]

If the animation works in 3D mode, then it'll work in AR provided you use our default WebXR mode. It sounds like it's failing in Scene Viewer or Quick Look. Check your console and you may see why WebXR is not working. It requires https and extra permission if in an iframe.

[anakin2022]

no I am testing over modelviewer editor directly so I dont need a private https server. You can try https://modelviewer.dev/editor/

please check files on modelviewer with those files. you should zip in a file and then upload to modelviewer... >> https://github.com/anakin2022/modelviewer/find/main

[elalish]

Wow, that file crashed chrome the first time I opened it in the editor. You have insanely large textures, especially compared to your number of triangles. This could easily be hitting performance limitations on various GPUs; downsample it a bunch as see if that helps.

[anakin2022]

There is a problem with the objects with rig and have materials... you got the yellow warning : skinned mesh

I try model an object directly on Blender .. I set a rig a material I did a simple animation and I got same error ...skinned mesh...
I try with model animated on mixamo ... same.

The model is render it well on 3d scene including animation... but when you go to AR augmented reality in google modelviewer.. nothing you got only a fixed object no animated...

[donmccurdy]

That warning is probably not what the problem is. If the model renders correctly in the 3D mode, the glTF file is working fine. When going to AR in iOS, the viewer is converting the glTF model into USDZ dynamically, and that's a more complicated process (it's not really documented anywhere what the Apple USDZ viewers support) that could have different issues. Here it's this issue – three.js cannot convert animations to USDZ: mrdoob/three.js#23415. And since Apple's viewers do not support glTF, there's currently no way around that.