Exact, that means you’ll have to code in order to manage your scenes at the moment.
For example, let’s say you have 2 scenes: A and B.
The “index.ts” file in “src/” is main entry point of the application. By default, it loads the scene named “scene” and imports the components of the scene named “scene”.
Imagine you rename “scene” to “A” and create another scene that you name “B”.
In the index.ts file you’ll have to change the import from “./scenes/scene” to “./scenes/A”
Also, you’ll have to change the path to the scene to load in the “._load” function
from
const rootUrl = "./scenes/scene/";
to
const rootUrl = "./scenes/A/";
Also, for example, if you want to append A and B you’ll have to:
Import components:
- import { runScene as runSceneA } from “./scenes/A”;
- import { runScene as runSceneB } from “./scenes/B”;
Modify the ._load function from
SceneLoader.Append(rootUrl, "scene.babylon", this.scene, () => {
this.scene.executeWhenReady(() => {
// Attach camera.
if (!this.scene.activeCamera) {
throw new Error("No camera defined in the scene. Please add at least one camera in the project or create one yourself in the code.");
}
this.scene.activeCamera.attachControl(this.engine.getRenderingCanvas(), false);
// Run the scene to attach scripts etc.
runScene(this.scene, rootUrl);
// Render.
this.engine.runRenderLoop(() => this.scene.render());
});
}, undefined, (_, message) => {
console.error(message);
}, "babylon");
to
const rootUrlA = "./scenes/A/";
const rootUrlB = "./scenes/B/";
await Promise.all([
SceneLoader.AppendAsync(rootUrlA, "scene.babylon", this.scene),
SceneLoader.AppendAsync(rootUrlB, "scene.babylon", this.scene),
]);
this.scene.executeWhenReady(() => {
// Attach camera.
if (!this.scene.activeCamera) {
throw new Error("No camera defined in the scene. Please add at least one camera in the project or create one yourself in the code.");
}
this.scene.activeCamera.attachControl(this.engine.getRenderingCanvas(), false);
// Run the scene to attach scripts etc.
runSceneA(this.scene, rootUrlA);
runSceneB(this.scene, rootUrlB);
// Render.
this.engine.runRenderLoop(() => this.scene.render());
});
Something like that. It is open to the developer to adopt his own strategy.
Unfortunately, managing scenes still requires development skills and no tools are provided in the Editor to manage/switch etc. scenes. This is in my todolist and they’ll come ASAP!
)