I have been experimenting with ways to toggle between two scenes in three.js. I know that one option is to load a scene using sceneLoader and exportScene together.
Code extracted from josdirksen/learning-threejs - loading a scene
var controls = new function () {
this.exportScene = function () {
var exporter = new THREE.SceneExporter();
var sceneJson = JSON.stringify(exporter.parse(scene));
localStorage.setItem('scene', sceneJson);
};
this.clearScene = function () {
scene = new THREE.Scene();
};
this.importScene = function () {
var json = (localStorage.getItem('scene'));
var sceneLoader = new THREE.SceneLoader();
sceneLoader.parse(JSON.parse(json), function (e) {
scene = e.scene;
}, '.');
}
};
As per my understanding of the provided code, it seems necessary to have the scene loaded before extracting and saving it to local storage for later reinsertion. It's important to note that SceneLoader is deprecated.
In my specific case, I aim to load an initial scene and then switch to display 'scene2' upon clicking a button named 'scene2'. Similarly, another button 'scene1' should revert back to displaying the first scene only (refer to the fiddle link below).
I'm seeking guidance on how to approach this task, so any tips or suggestions would be greatly appreciated.