Use NumberKeyframeTrack for own properties

Currently I use serveral NumberKeyframeTrack via PropertyBinding to control the morphtargets/blendshapes of a face. Now I want replace the morphtargets/blendshapes with bonerigs to control the face animation. So I want to control a bone or Object3D with the values from the same NumberKeyframeTracks.

Is it possible to map the number PropertyBinding to an own number property in a derived object2d class in the scene graph? In the source I saw only a binding to “morphTargetDictionary”

Have you any hints for me. Thanks, Christian

The following example shows how you setup keyframe tracks for animating arbitrary object (and even material) properties.

If keyframe tracks are already existing, you can change the name property to target a different object property.

hi, apologies for reviving but this matches my topic

i’m using NumberKeyframeTrack to make a keyframe timeline of my own properties

here’s the snippet

const mesh = new Mesh() // placeholder mesh for mixer
mesh.testVal = 0 //custom property not related to mesh

let mixer = new AnimationMixer(mesh);

const testTrack= new NumberKeyframeTrack('.testVal', [0, 1, 2], [200, -200, 400]);

const clip = new AnimationClip('test_action', 3, [testTrack]);

const clipAction = mixer.clipAction(clip);;

and to scrub through im using gui

 const params= {
            time: 0
gui.add(params, 'time', 0, 2, 0.01).onChange((v) => {
   console.log(v, mesh.testVal)

this works ! (any suggestions to improve this is welcome)

but if i use

mesh.userData.testVal = 0

& ".userData.testVal" as track name ( similar to how ‘.material.opacity’ works in the example)

then i get this error , any idea why ?

three.module.js:44598 THREE.PropertyBinding: Trying to update property for track: .userData.testVal but it wasn't found.

I see a mismatch between:

mesh.testVal = 0 //custom property not related to mesh


mesh.userData.testVal = 0


i’ll clarify a bit more

mesh.testVal = 0
and trackname '.testVal'


mesh.userData.testVal = 0
& track name ".userData.testVal"

does not !

but in the example above '.material.opacity' works so was wondering why