Hi everyone,
I’m new to BabylonJs and I’ve been trying to use morph targets to make an imported character model’s mouth move using morph targets but every time I try to change it’s influence using mesh.morphTargetManager.getTarget(key).influence = 1; the position of my character models mouth doesn’t change. I even tried writing console.log(mesh.morphTargetManager.getTarget(key).influence = 1); to the console and the influence said 1 even though the mouth still didn’t move
If you need my source code I’ve pasted it here.
var canvas = document.getElementById(“renderCanvas”);
var currentGroup;
var scrambleUp = function(data) {
for (index = 0; index < data.length; index ++) {
data[index] += 0.4 * Math.random();
}
}
var createScene = function () {
var scene = new BABYLON.Scene(engine);
//var camera = new BABYLON.FreeCamera(“camera1”, new BABYLON.Vector3(0, 5, -10), scene);
var camera = new BABYLON.ArcRotateCamera(“camera1”, Math.PI / -2, 1, 3, new BABYLON.Vector3(0, 3, 0), scene);
camera.attachControl(canvas, true);
//camera.position = new BABYLON.Vector3(0, 50, -40);
var light = new BABYLON.HemisphericLight(“light1”, new BABYLON.Vector3(0, 1, 0), scene);
light.intensity = 0.7;
var ground = BABYLON.Mesh.CreateGround(“ground1”, 6, 6, 2, scene);
var assetsManager = new BABYLON.AssetsManager(scene);
var gui;
var scales = [];
var url;
var fileName;
url = 'https://raw.githubusercontent.com/chris45242/BabylonModel/main/';
fileName = "project.blend1.glb";
//fileName = "scene.babylon";
var manager = new BABYLON.MorphTargetManager(scene);
BABYLON.SceneLoader.ImportMesh("", url, fileName, scene, function (meshes, animationGroups, particleSystems, skeletons){
var casi = meshes[0];
casi.setParent(null);
scene.stopAllAnimations();
scene.animationPropertiesOverride = new BABYLON.AnimationPropertiesOverride();
scene.animationPropertiesOverride.enableBlending = true;
scene.animationPropertiesOverride.blendingSpeed = 0.02;
scene.animationPropertiesOverride.loopMode = 1;
//UI
var advancedTexture = BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");
advancedTexture.renderScale = 0.5;
var UiPanel = new BABYLON.GUI.StackPanel();
UiPanel.width = "220px";
UiPanel.fontSize = "14px";
UiPanel.horizontalAlignment = BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_RIGHT;
UiPanel.verticalAlignment = BABYLON.GUI.Control.VERTICAL_ALIGNMENT_CENTER;
advancedTexture.addControl(UiPanel);
scene.animationGroups[0].start(true);
scene.animationGroups[1].start(true);
var casiLips = scene.getMeshByName(“Casi’s Body.001_primitive0”);
var clonedCasiLips = casiLips.clone(“Casi’s Body.001_primitive0_clone”);
clonedCasiLips.setEnabled(false);
var casiInnerMouth = scene.getMeshByName(“Casi’s Body.001_primitive2”);
casiInnerMouth.setEnabled(false);
var clonedCasiInnerMouth = casiInnerMouth.clone(“Casi’s Body.001_primitive2_clone”);
clonedCasiInnerMouth.setEnabled(false);
var primitive = scene.getMeshByName(“Primitives.001”);
var casiEyes = scene.getMeshByName(“Casi’s Body.001_primitive1”);
var casiTeeth = scene.getMeshByName(“Casi’s Teeth”);
var casiVisor = scene.getMeshByName(“Casi’s Visor”);
var casiLipsPosition = casiLips.getVerticesData(BABYLON.VertexBuffer.PositionKind);
casiLips.updateVerticesData(BABYLON.VertexBuffer.PositionKind, casiLipsPosition);
casiLips.morphTargetManager.getTarget(1).influence = 1.0;
console.log(casiLips.morphTargetManager.getTarget(1).influence);
console.log(casiInnerMouth.getTotalVertices());
console.log(casiEyes.position);
console.log(casiLips.morphTargetManager);
clonedCasiLips.morphTargetManager = manager;
manager.influences = 1.0;
console.log(manager);
var target0 = BABYLON.MorphTarget.FromMesh(clonedCasiLips, "Casi's Lips", 1.0);
manager.addTarget(target0);
console.log(target0);
var angle = 0;
scene.registerBeforeRender(function() {
target0.influence = Math.sin(angle)*Math.sin(angle);
angle += 0.01;
})
});
assetsManager.load();
return scene;
};
var engine = new BABYLON.Engine(canvas, true, { preserveDrawingBuffer: true, stencil: true });
var scene = createScene();
engine.runRenderLoop(function () {
if (scene) {
scene.render();
}
});
// Resize
window.addEventListener(“resize”, function () {
engine.resize();
});
Am I doing something wrong?
