What is exact way to use getMeshByName("") from Scene to play with morph targets in react-babylonjs npm

Questions
,
1

This is my code block.

Screenshot from 2022-08-11 12-08-52
Screenshot from 2022-08-11 12-08-52781×807 71.9 KB

Previously with using canvas and plain Babylon
let casiBody = await scene.getMeshByName(“bubble_short_primitive1”);
This was working fine,

const onSceneMount = async (e: any) => {
const { scene } = e;
let casiBody = await scene.getMeshByName(“bubble_short_primitive1”);
console.log(casiBody, “”);

// casiBody.morphTargetManager.getTarget(0).influence = 1

};

But now I am unable to get scene.getMeshByName(“bubble_short_primitive1”);

Because the onSceneMount is loading before loading children components [ Model ]

Or Should I use the morphTargetManager prop to change the Morph targets.

<Model
rootUrl={https://raw.githubusercontent.com/ml-bhanuprakash/babylonjs/main/test_3/}
sceneFilename={blouse_03.glb}
scaleToDimension={0}
// morphTargetManager={ MorphTargetManager. }
// scaling={new Vector3(1,1,1)}

              onModelLoaded={async (model) => {
                await onModelLoaded(model);
                // setLoadModel1(true);
              }}
              name={""}
            ></Model>
2

Isn’t that related to your previous question Can anyone help me with adding morphTargets using react-babylonjs? - Questions - Babylon.js ? Please don’t open multiple topics for the same question.

3

Yes sorry It is related to previews question.

I found a solution. I can use onCreated prop in the Model. Now I can change the morph targets.
Here is the code.

 <Model
              rootUrl={`https://raw.githubusercontent.com/ml-bhanuprakash/babylonjs/main/test_3/`}
              sceneFilename={`blouse_03.glb`}
              scaleToDimension={0}
              // morphTargetManager={  }
              // scaling={new Vector3(1,1,1)}
              onCreated={(e) => {
                onCreatedModel1(e);
              }}
              onModelLoaded={async (model) => {
                await onModelLoaded(model);
                // setLoadModel1(true);
              }}
              name={""}
            ></Model>

const onCreatedModel1 = async (e: any) => {
console.log(e, “Model”);

console.log(e._scene, "Scene");
let casiBody = e._scene.getMeshByName("bubble_short_primitive1");
// console.log(e._scene.morphTargetManagers[0], "e._scene");
casiBody.morphTargetManager.getTarget(0).influence = 1;
casiBody.morphTargetManager.getTarget(1).influence = 1;
casiBody.morphTargetManager.getTarget(2).influence = 1;

};

1 Like