Hi,
For an application I’m building I want to be able to know when to take a snapshot programatically as soon as the scene loads. I’m just recently discovering that the fact that resources are loaded does not mean that they are rendered so I thought that I could use the onBefore/onAfterRender to see if resources were present at the moment we render.
Just to give you an idea of what I’m talking about:
MeshRenderedStore.getInstance().addValue(mesh.uuid, mesh);
mesh.onBeforeRender = (renderer, scene, camera, geometry, material, group) => {
console.log(`threePieceReconciler onBeforeRender ${mesh.name} ${material.type}`);
console.log(mesh);
console.log(geometry);
console.log(material);
console.log('mesh user data:', mesh.userData);
console.log('parent user data:', mesh.parent.userData);
const maps = material.userData.maps;
// Proper material not attached yet
if (!maps) {
return;
}
console.log(maps);
if (
maps.every((map) => {
console.log(material[map]?.image);
return material[map] && material[map].image !== material[map].defaultImage;
})
) {
console.log('ALL MAPS LOADED');
MeshRenderedStore.getInstance().removeValue(mesh.uuid);
mesh.onBeforeRender = () => {};
mesh.hadResourcesBeforeRender = true;
} else {
console.log('NOT ALL MAPS LOADED');
}
};
mesh.onAfterRender = () => {
if (mesh.hadResourcesBeforeRender) {
MeshRenderedStore.getInstance().removeValue(mesh.uuid);
mesh.onAfterRender = () => {};
}
};
I have a debugger set as soon as I do the last removeValue and when I see the viewport some maps are still not rendered, maybe there’s actually no way to know? Is there anything to unmistakingly know that all the loaded resources were rendered?