Hey,
for a university project i wrote this website and used BabylonJS for the configurator and preview of the orders. It’s working really good, however i noticed, sometimes i can see an error in the console, tho i don’t see anything wrong in the canvas itself.
So when i select an order, it will show the preview of that order.
Sometimes when the preview is loaded, i notice this error in the console:
So this error seems to be thrown somewhere inside the scene.createDefaultEnvironment
function.
This is how i construct my scene:
async createScene() {
this.engine = new Engine(
this.$refs.canvas,
true,
{ preserveDrawingBuffer: true },
false
);
this.babylon.scene = new Scene(this.engine);
var camera = new ArcRotateCamera(
"camera",
-Math.PI / 2,
Tools.ToRadians(67),
350,
new Vector3(0, 50, 0),
this.babylon.scene
);
this.scene.camera = camera;
camera.useAutoRotationBehavior = true;
camera.autoRotationBehavior.idleRotationSpeed = 0.25;
camera.lowerRadiusLimit = 250;
camera.upperRadiusLimit = 800;
camera.attachControl(this.$refs.canvas, true);
this.scene.highlightLayer = new HighlightLayer("hl1", this.babylon.scene);
new HemisphericLight("light1", new Vector3(1, 1, 0), this.babylon.scene);
this.babylon.scene.createDefaultEnvironment({
createGround: false,
createSkybox: true,
skyboxSize: 1500,
skyboxColor: new Color3(144 / 255, 202 / 255, 249 / 255),
enableGroundMirror: false,
});
var defaultPipeline = new DefaultRenderingPipeline(
"DefaultRenderingPipeline",
false, // is HDR?
this.babylon.scene,
this.babylon.scene.cameras
);
defaultPipeline.samples = 1;
defaultPipeline.fxaaEnabled = false;
this.scene.plateMaterial = createPlateMaterial(this.babylon.scene);
this.scene.cylinderMaterial = createCylinderMaterial(this.babylon.scene);
var assetLoader = new AssetsManager(this.babylon.scene);
loadPlateMesh(
assetLoader,
(mesh) => (this.scene.plateMesh = mesh),
this.scene.plateMaterial
);
loadSymbolAMesh(assetLoader, (mesh) => {
this.scene.symbolAMesh = mesh;
this.scene.symbolAMesh.billboardMode = Mesh.BILLBOARDMODE_ALL;
});
loadSymbolBMesh(assetLoader, (mesh) => {
this.scene.symbolBMesh = mesh;
this.scene.symbolBMesh.billboardMode = Mesh.BILLBOARDMODE_ALL;
});
await assetLoader.loadAsync();
this.previewConfiguration(this.selectedOrder);
},
And my mounted() function:
async mounted() {
await this.createScene();
this.babylon.sceneReady = true;
this.babylon.canvas = this.$refs.canvas;
this.engine.runRenderLoop(() => {
this.babylon.scene.render();
});
},
Is there something wrong about the way i use createDefaultEnvironment
?
This error does not occur every time, so i wonder if its some kind of race condition or sth.
Thanks alot for your help!