Hey guys I have created a simple scene where one ground and 3-4 boxes are placed.
I export this scene out using the inspector for some experiment. After than i tried to use that scene so I upload it here https://sandbox.babylonjs.com/ .
But when I uploaded it here. I did not get my scene it’s all empty (You can check in the image below).
Pls help me out or I gonna cry 
Hello,
Maybe you can share the file, so we can have a look ? You can compress it to .zip and then upload it here in a post 
++
Tricotou
the code I write is very bad, if you take a look you will probably ban me from this forum
class BabylonInstanceEngine {
reactCanvas = null;
engine;
scene;
utilLayer;
canvas;
initialize(_canva) {
if (!_canva) return;
this.canvas = _canva;
this.engine = new Engine(this.canvas);
this.scene = new Scene(this.engine);
this.run();
if (this.scene.isReady()) {
// console.log(this.scene);
this.camera = new ArcRotateCamera(
"camera1",
(3 * Math.PI) / 2,
-Math.PI / 2,
20,
Vector3.Zero(),
this.scene
);
this.camera.setTarget(Vector3.Zero());
this.camera.attachControl(this.canvas, true);
const light = new HemisphericLight(
"light",
new Vector3(0, 1, 0),
this.scene
);
light.intensity = 0.7;
console.log("Scene is working");
this.run();
} else {
console.log("Scene is not working");
}
}
run() {
if (this.engine && this.scene) {
this.engine.runRenderLoop(() => {
this.scene.render();
});
}
}
debug() {
new DebugLayer(this.scene).show({
embedMode: true,
gizmoCamera: this.camera,
});
}
resize() {
if (this.engine) {
this.engine.resize();
}
}
gizmo() {
var utilLayer = new UtilityLayerRenderer(this.scene);
var translationGizmo = new BABYLON.PositionGizmo(utilLayer);
translationGizmo.updateGizmoRotationToMatchAttachedMesh = false;
var rotationGizmo = new BABYLON.RotationGizmo(utilLayer);
// rotationGizmo.updateGizmoRotationToMatchAttachedMesh = false;
var objClick = [];
// event on position gizmo x drag
translationGizmo.xGizmo.dragBehavior.onDragObservable.add((event) => {
objClick
.filter((mesh) => mesh != translationGizmo.attachedMesh)
.forEach((mesh) => {
mesh.position.x += event.delta.x;
});
});
// event on position gizmo y drag
translationGizmo.yGizmo.dragBehavior.onDragObservable.add((event) => {
objClick
.filter((mesh) => mesh != translationGizmo.attachedMesh)
.forEach((mesh) => {
mesh.position.y += event.delta.y;
});
});
// event on position gizmo z drag
translationGizmo.zGizmo.dragBehavior.onDragObservable.add((event) => {
objClick
.filter((mesh) => mesh != translationGizmo.attachedMesh)
.forEach((mesh) => {
mesh.position.z += event.delta.z;
});
});
// event on rotation gizmo x drag
rotationGizmo.xGizmo.dragBehavior.onDragObservable.add(() => {
objClick
.filter((mesh) => mesh != rotationGizmo.attachedMesh)
.forEach((mesh) => {
// mesh.rotation.x += rotationGizmo.xGizmo.angle;
mesh.rotate(
BABYLON.Axis.X,
rotationGizmo.xGizmo.angle,
BABYLON.Space.LOCAL
);
});
rotationGizmo.xGizmo.angle = 0;
});
// event on rotation gizmo y drag
rotationGizmo.yGizmo.dragBehavior.onDragObservable.add(() => {
objClick
.filter((mesh) => mesh != rotationGizmo.attachedMesh)
.forEach((mesh) => {
// mesh.rotation.y += rotationGizmo.yGizmo.angle;
mesh.rotate(
BABYLON.Axis.Y,
rotationGizmo.yGizmo.angle,
BABYLON.Space.LOCAL
);
});
rotationGizmo.yGizmo.angle = 0;
});
// event on rotation gizmo z drag
rotationGizmo.zGizmo.dragBehavior.onDragObservable.add(() => {
objClick
.filter((mesh) => mesh != rotationGizmo.attachedMesh)
.forEach((mesh) => {
// mesh.rotation.z += rotationGizmo.zGizmo.angle;
mesh.rotate(
BABYLON.Axis.Z,
rotationGizmo.zGizmo.angle,
BABYLON.Space.LOCAL
);
});
rotationGizmo.zGizmo.angle = 0;
});
// click event
this.scene.onPointerObservable.add((pointerInfo) => {
switch (pointerInfo.type) {
case BABYLON.PointerEventTypes.POINTERTAP: {
var pickResult = this.scene.pick(
this.scene.pointerX,
this.scene.pointerY
);
if (pickResult.hit) {
pickResult.pickedMesh.showBoundingBox = true;
translationGizmo.attachedMesh = pickResult.pickedMesh;
rotationGizmo.attachedMesh = pickResult.pickedMesh;
objClick.push(pickResult.pickedMesh);
} else {
objClick.forEach((mesh) => (mesh.showBoundingBox = false));
translationGizmo.attachedMesh = undefined;
rotationGizmo.attachedMesh = undefined;
objClick = [];
}
break;
}
}
});
}
box(y_pos) {
console.log("Starting box function with y position: " + y_pos);
try {
this.boxs = MeshBuilder.CreateBox(
"box",
{ size: 2, updatable: true },
this.scene
);
console.log("Box created, setting position...");
this.boxs.position.y = y_pos;
this.scene.render();
console.log("Position set to y_pos: " + this.boxs.position.y);
console.log("Box : " + this.boxs);
} catch (error) {
console.error("An error occurred: ", error);
}
}
ground() {
const gd = MeshBuilder.CreateGround(
"ground",
{ width: 6, height: 6 },
this.scene
);
console.log("ground : " + gd);
}
sphere() {
const keyPress = {
w: false,
a: false,
s: false,
d: false,
};
const initialSpeed = 0;
const desiredSpeed = 0.01;
const acceleration = 0.0001;
const deceleration = 0.001;
let currentSpeed = initialSpeed;
// Set up easing function
const lerp = (start, end, t) => {
return start * (1 - t) + end * t;
};
var sphere = MeshBuilder.CreateSphere(
"sphere",
{ diameter: 2, segments: 32 },
this.scene
);
// Move the sphere upward 1/2 its height
sphere.position.y = 1;
this.scene.onKeyboardObservable.add((kbInfo) => {
switch (kbInfo.type) {
case KeyboardEventTypes.KEYDOWN:
switch (kbInfo.event.key) {
case "a":
case "A":
keyPress["a"] = true;
break;
case "d":
case "D":
keyPress["d"] = true;
break;
case "w":
case "W":
keyPress["w"] = true;
break;
case "s":
case "S":
keyPress["s"] = true;
break;
}
break;
case KeyboardEventTypes.KEYUP:
switch (kbInfo.event.key) {
case "a":
case "A":
keyPress["a"] = false;
break;
case "d":
case "D":
keyPress["d"] = false;
break;
case "w":
case "W":
keyPress["w"] = false;
break;
case "s":
case "S":
keyPress["s"] = false;
break;
}
break;
}
});
this.scene.registerBeforeRender(() => {
if (keyPress["w"] || keyPress["a"] || keyPress["s"] || keyPress["d"]) {
if (currentSpeed < desiredSpeed) {
currentSpeed = Math.min(currentSpeed + acceleration, desiredSpeed);
}
} else {
if (currentSpeed > 0) {
currentSpeed = Math.max(currentSpeed - deceleration, 0);
}
}
const sign = Math.sign(this.camera.alpha);
let movement = new Vector3(0, 0, 0);
if (keyPress["w"]) {
const angle =
-this.camera.alpha + (sign === -1 ? Math.PI / 2 : -Math.PI / 2);
movement = new Vector3(Math.sin(angle), 0, Math.cos(angle));
}
if (keyPress["a"]) {
const angle = this.camera.alpha + (sign === 1 ? -Math.PI : Math.PI);
movement = new Vector3(-Math.sin(angle), 0, -Math.cos(angle));
}
if (keyPress["d"]) {
const angle = this.camera.alpha + (sign === 1 ? -Math.PI : Math.PI);
movement = new Vector3(Math.sin(angle), 0, Math.cos(angle));
}
if (keyPress["s"]) {
const angle =
-this.camera.alpha + (sign === -1 ? Math.PI / 2 : -Math.PI / 2);
movement = new Vector3(-Math.sin(angle), 0, -Math.cos(angle));
}
movement.normalize();
const scaledSpeed =
currentSpeed * this.scene.getEngine().getDeltaTime();
movement.scaleInPlace(scaledSpeed);
sphere.position.addInPlace(movement);
});
alert("Use W,A,S,D to move the ball");
this.run();
}
}
I am using this code in my react frontend
Did you figure out the problem?
It’s not clear exactly what is your problem here 
Your title + first post suggests that you are having an issue loading a .babylon file in the sandbox. That’s why I was advising to share this .babylon file with us (using .zip)
The code you shared is about creating the scene itself (BABYLON.MeshBuilder, etc) and not about loading…
Oh sorry. I misunderstood your above reply.
Here is the .babylon file
scene_tron.zip (56.5 KB)
any progress in finding out the cause of the problem?
Indeed, importing the .babylon file in a sandbox, I have nothing but camera and light.
Did you have something else in your app before exporting ? Because having a look at your code, I see no place where your functions ground, sphere, or box, are called…
Here take a look at these code
Might this will help you