Hi. I am new to Babylon.js
Nice to see you guys!
I just copied an example on Playground and pasted it on my editor to run it on local, but it keeps saying “scene.render() is not a function”
I saw this “[HELP] Scene.Render is not a function” post where it required const scene = await createScene()
but this way, I just get “await must be used with async”
Can someone please explain what is happening here?
Thanks a lot!
code I copied
const canvas = document.getElementById("renderCanvas");
const engine = new BABYLON.Engine(canvas, true);
const createScene = async function () {
const scene = new BABYLON.Scene(engine);
const camera = new BABYLON.UniversalCamera("camera1", new BABYLON.Vector3(0, 20, 0), scene);
camera.setTarget(new BABYLON.Vector3(0, 5, 0))
camera.attachControl(canvas, true);
const light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(0, 1, 0), scene);
// import boxes
const data = await BABYLON.SceneLoader.ImportMeshAsync("", "https://raw.githubusercontent.com/griga/babylonjs-resources/master/scenes/", "hover-instances.babylon", scene);
const sourceMesh = data.meshes[0];
// coloring part
const sourceMat = sourceMesh.material;
const color = sourceMat.albedoColor;
const instanceCount = sourceMesh.instances.length;
sourceMesh.registerInstancedBuffer("color", 4); // 4 is the stride size eg. 4 floats here
const vcolor = new BABYLON.Color4(color.r, color.g, color.b, 0.1);
const vcolorHover = new BABYLON.Color4(1, 0, 0, 0.1);
sourceMesh.instancedBuffers.color = vcolor;
for (let index = 0; index < instanceCount; index++) {
sourceMesh.instances[index].instancedBuffers.color = vcolor;
}
// hovering part
let hoveredMeshes = [];
scene.onBeforeRenderObservable.add(() => {
const pickResult = scene.pick(scene.pointerX, scene.pointerY, (mesh) => mesh.isPickable && mesh.isVisible && mesh.isReady(), false, camera);
if (pickResult.hit) {
if (!hoveredMeshes.includes(pickResult.pickedMesh.id)) {
hoveredMeshes.push(pickResult.pickedMesh.id);
setInstancedMeshesColor(hoveredMeshes, vcolorHover, scene);
}
} else if (hoveredMeshes.length > 0) {
setInstancedMeshesColor(hoveredMeshes, vcolor, scene);
hoveredMeshes = []
}
});
return scene;
};
function setInstancedMeshesColor(hoveredMeshes, color, scene) {
hoveredMeshes.forEach(meshId => {
scene.getMeshByID(meshId).instancedBuffers.color = color;
});
};
const scene = createScene();
engine.runRenderLoop(function () {
scene.render();
})
window.addEventListener("resize", function () {
engine.resize();
})