I've been working with BabylonJS and recently imported a Mesh from Blender.
However, I encountered an issue at this line :
x = this.cube.position.x;
It resulted in
Uncaught TypeError: Cannot read property 'position' of undefined
Below is the complete code :
export class Game {
private canvas: HTMLCanvasElement;
private engine: BABYLON.Engine;
private scene: BABYLON.Scene;
private camera: BABYLON.FreeCamera;
private light: BABYLON.Light;
private skybox: BABYLON.Mesh;
private skyboxMaterial: BABYLON.StandardMaterial;
private waterMesh: BABYLON.Mesh;
private water: Materials.WaterMaterial;
private ground: BABYLON.Mesh;
private groundTexture: BABYLON.Texture;
private groundMaterial: BABYLON.StandardMaterial;
private sphere: BABYLON.Mesh;
private sphereMaterial: BABYLON.StandardMaterial;
private cube: BABYLON.Mesh;
constructor(canvasElement : string) {
// Create canvas and engine.
this.canvas = document.getElementById(canvasElement) as HTMLCanvasElement;
this.engine = new BABYLON.Engine(this.canvas, true);
}
createScene() : void {
this.scene = new BABYLON.Scene(this.engine);
this.camera = new BABYLON.FreeCamera("Camera", BABYLON.Vector3.Zero(), this.scene);
this.camera.attachControl(this.canvas, true);
this.light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), this.scene);
// Skybox
this.skybox = BABYLON.Mesh.CreateBox("skyBox", 1000.0, this.scene);
this.skyboxMaterial = new BABYLON.StandardMaterial("skyBox", this.scene);
...
....
};
////////// RAY CAST TO FIND WATER HEIGHT ////////////
...
doRender() : void {
// Run the render loop.
this.engine.runRenderLoop(() => {
this.scene.render();
});
// The canvas/window resize event handler.
window.addEventListener('resize', () => {
this.engine.resize();
});
}
While I understand that adding a null check can resolve the error, I find it puzzling why my cube is undefined when using (ImportMesh) which is supposed to be a Synched function.
Implementing a null check resolved the error for me.