Testing ARnft-Threejs changes from PR https://github.com/webarkit/ARnft-threejs/pull/29
The example examples/arNFT_gltf_flamingo_example.html use the new addModelWithCallback method to load a gltf model and play the gltf animations thanks to the callback. You need to provide the necssary code to enable the animations(mixers) and update it in the tick function.
let nftAddTJS = new ARnftThreejs.NFTaddTJS(nft.uuid);
let mixers = [];
let clock = new THREE.Clock();
function modelAnimation(gltf) {
var model = gltf.scene.children[0];
model.rotation.x = Math.PI / 2;
var animation = gltf.animations[0];
var mixer = new THREE.AnimationMixer(model);
mixers.push(mixer);
var action = mixer.clipAction(animation);
action.play();
}
function updateAnimations() {
if (mixers.length > 0) {
for (var i = 0; i < mixers.length; i++) {
mixers[i].update(clock.getDelta());
}
}
}
nftAddTJS.addModelWithCallback("./Data/models/flamingo/Flamingo.glb", "pinball", modelAnimation, false);
const tick = () => {
sceneThreejs.draw();
window.requestAnimationFrame(tick);
updateAnimations();
};
tick();
Both addModel and addModelWithCallback use the new reposition of the model, that automatically place the model in the middle of the marker.
Testing ARnft-Threejs changes from PR https://github.com/webarkit/ARnft-threejs/pull/29 The example
examples/arNFT_gltf_flamingo_example.html
use the new addModelWithCallback method to load a gltf model and play the gltf animations thanks to the callback. You need to provide the necssary code to enable the animations(mixers) and update it in the tick function.Both addModel and addModelWithCallback use the new reposition of the model, that automatically place the model in the middle of the marker.