[SOLVED] Is it possible to animate morphs?

Hi. I know that it is possible to set the morph weight for every frame and it could be a good solution for some cases.
But usually, the animator creates keyframes for an animation track with all morph weight data.
Is it possible to load such an animation track as an asset and play it with animated morphs?

According to @will: Morph Target Support · Issue #179 · playcanvas/engine · GitHub it is not supported right now.
But I see someone using morph target animation track here: Play Morph Target animation in reverse He is doing it with playcanvas-gltf loader.
Would you please elaborate on it?

It does work using engine’s built in glb loader. You can test it by downloading this glb file:

and playing this in our viewer: https://playcanvas.com/viewer

I’ve tested it with many other glb files when working on morphing.

1 Like

Yeah, I see it, looks very nice.
What do you use to create this cube and animation for it? Is it a .fbx file converted to .glb with PlayCanvas converter?
I wonder if is it possible to create such animations offline. AFAIK the build-in glb loader is using it is own formating to store the morphs information.

Edit: Sorry, I didn’t notice that the file was made by the KronosGroup. But anyway, I have no idea how to make such .glb files without PC converter.

you can use PlayCanvas Editor and import fbx
you can use this to convert fbx to glb: https://github.com/facebookincubator/FBX2glTF
or you can use Blender to animated and export to fbx or glb
and there are other tools you can use to do the same, most of them either let you export fbx or glb or both

If you remember our previous discussion, there is an issue about importing morph data to the engine: [Suggestion] FBX to GLB offline converter
It seems, currently, the playcanvas converter is the only one that can save the morph data properly (for the engine to read it).

Also, I was curious and tested your cube in a simple scene: https://playcanvas.com/editor/scene/1085983

var GlbLoad = pc.createScript('glbLoad');
GlbLoad.attributes.add('glbAsset', { type: 'asset', assetType: 'binary'});

// initialize code called once per entity
GlbLoad.prototype.initialize = function() {
    var self = this;
    utils.loadGlbContainerFromAsset(this.glbAsset, null, this.glbAsset.name, function (err, asset) {
        self.entity.model.asset = asset.resource.model;
        var anim_assets = [asset.resource.animations[0]];
        self.entity.animation.assets = anim_assets;
        self.entity.animation.play(self.entity.animation.assets[0].name, 0.01);
    });
};
[playcanvas-stable.dbg.js:13714]: Cannot read property 'split' of undefined

TypeError: Cannot read property 'split' of undefined
    at GraphNode.findByPath (https://code.playcanvas.com/playcanvas-stable.dbg.js:13714:21)
    at DefaultAnimBinder.resolve (https://code.playcanvas.com/playcanvas-stable.dbg.js:36825:26)
    at AnimEvaluator.addClip (https://code.playcanvas.com/playcanvas-stable.dbg.js:36506:35)
    at AnimationComponent.play (https://code.playcanvas.com/playcanvas-stable.dbg.js:37210:25)
    at AnimationComponent.onSetAnimations (https://code.playcanvas.com/playcanvas-stable.dbg.js:37458:11)
    at AnimationComponent.fire (https://code.playcanvas.com/playcanvas-stable.dbg.js:702:18)
    at AnimationComponent. (https://code.playcanvas.com/playcanvas-stable.dbg.js:35712:10)
    at AnimationComponent.fire (https://code.playcanvas.com/playcanvas-stable.dbg.js:702:18)
    at AnimationComponent.set (https://code.playcanvas.com/playcanvas-stable.dbg.js:35731:12)
    at onAssetReady (https://code.playcanvas.com/playcanvas-stable.dbg.js:37293:21)

It looks like the same error.
So, this cube is working in the viewer, but not in the engine.
It seems complicated. So, https://playcanvas.com/viewer is not using the build in glb loader?

@Elliott was fixing issue with the split path and few others in the anim system … perhaps we can double check this case works as well. Either way, the fixes should come out in the engine release early this week, perhaps even Monday. Please get in touch if you still have the issues with this.

1 Like

And also - the viewer is using built in glb loader … so I’m not sure where the difference comes from. Perhaps see the source code of the viewer to see what’s different.

The viewer using PlayCanvas engine version 1.38.0 where as the editor is using latest (1.38.4).

You can see the animated GLB working here with the older version of the engine: https://launch.playcanvas.com/1086032?debug=true&use_local_engine=https://code.playcanvas.com/playcanvas-1.38.0.js

Checking against latest doesn’t give the error but also doesn’t animate :thinking:
https://launch.playcanvas.com/1086032?debug=true&use_local_engine=https://code.playcanvas.com/playcanvas-latest.js

1 Like

This bug was introduced while moving the animation binding to use full paths instead of node names. I’m submitting a fix for this now so it’ll go out with 1.39.0!

1 Like

Thank you all, PlayCanvas team. Now the test cube from the project above is working.

2 Likes