# Importing and exporting a scene

**URL:** <https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697>\
**Category:** Questions\
**Created:** [April 2, 2020, 3:06pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697 "2020-04-02T15:06:51Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![ncarr](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/ncarr/32/7646_2.png) [@ncarr](https://forum.babylonjs.com/u/ncarr)\
**Post date:** [April 2, 2020, 3:06pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/1 "2020-04-02T15:06:51Z")

</div>

Hello!

I am trying to export my entire scene and save it too firebase. Then reimport it. It is an essential function for the application I am developing.

I am looking through the exporters and imports and I have yet to be able to get a round trip to work. I have been able to successfully export the scene with SceneSerilizer, but when I try to reimport that scene with SceneLoader it throws an error.

I am also willing to use gltf export/import.

I am using typescript.

Is there a guide out there already for this situation?  
(I have been unsuccessful in finding one that helps me to understand what I need to do or what I have done wrong).

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [April 2, 2020, 3:28pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/2 "2020-04-02T15:28:53Z")

</div>

Hello and welcome to our community!  
Can you share a repro in the Playground?

pinging @drigax for review once we will get the repro 😉

---

<div class="post-metadata">

**Author:** ![ncarr](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/ncarr/32/7646_2.png) [@ncarr](https://forum.babylonjs.com/u/ncarr)\
**Post date:** [April 2, 2020, 4:22pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/3 "2020-04-02T16:22:49Z")

</div>

I will work on reproducing with firebase.

In the meantime, this is the error I am seeing:

Unable to find a plugin to load .5,“overlaycolor”:[1,0,0],“applyfog”:true}],“particlesystems”:[]} files. Trying to use .babylon default plugin. To load from a specific filetype (eg. gltf) see

My methods

private exportScene(scene: Scene): string {  
return JSON.stringify(SceneSerializer.Serialize(scene))  
}

private importScene(gameState: GameState): void {  
SceneLoader.loggingLevel = 1  
SceneLoader.LoadAsync(’’, ‘Data:’ + gameState.jsonScene, this.engine)  
}

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [April 2, 2020, 4:31pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/4 "2020-04-02T16:31:17Z")

</div>

Well I guess loadAsync does not expect json data but base64 string or an actual url

---

<div class="post-metadata">

**Author:** ![ncarr](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/ncarr/32/7646_2.png) [@ncarr](https://forum.babylonjs.com/u/ncarr)\
**Post date:** [April 2, 2020, 4:42pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/5 "2020-04-02T16:42:38Z")

</div>

Hmmmm, Load() gives me the same error. Is Append() the only method that supports json?

---

<div class="post-metadata">

**Author:** ![ncarr](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/ncarr/32/7646_2.png) [@ncarr](https://forum.babylonjs.com/u/ncarr)\
**Post date:** [April 2, 2020, 6:15pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/6 "2020-04-02T18:15:57Z")

</div>

@Drigax

[https://www.babylonjs-playground.com/#KC5W6L](https://www.babylonjs-playground.com/#KC5W6L)

It does not present an error here but it does fail silently.

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [April 2, 2020, 7:16pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/7 "2020-04-02T19:16:13Z")

</div>

It does generate errors:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/a/a0ee28730fc684b8a1ad513b5870ddad0c4865ae.png)  
You should use “data:” and not “Data:” and the json scene should be stringified:

[https://www.babylonjs-playground.com/#KC5W6L#2](https://www.babylonjs-playground.com/#KC5W6L#2)

It still does not display anything but there’s no more errors in the console, so hopefully it’s a step in the right direction.

---

<div class="post-metadata">

**Author:** ![Drigax](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/drigax/32/16585_2.png) [@Drigax](https://forum.babylonjs.com/u/Drigax)\
**Post date:** [April 14, 2020, 5:15pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/8 "2020-04-14T17:15:22Z")

</div>

@ncarr I don’t think that there is anything wrong with the SceneLoader, I traced through the sceneloader as it serialized your JSON scene successfully. I believe that the problem is what you’re doing with the scene after its serialized.

Check my modified playground: [https://www.babylonjs-playground.com/#KC5W6L#3](https://www.babylonjs-playground.com/#KC5W6L#3)

In this, we create that serialized json string, but _append_ it to the current scene. we can see that our object and material serialize and are populated in the active scene as expected.

The problem with the previous playgrounds are that we serialized the scene, but the engine was already told to use our empty scene with camera we created. we have 2 scenes in memory in the callback function for `BABYLON.SceneLoader.Load()`, but we’re only using the first one we made and returned via createScene.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/b/b33064f3e412acc31adab3a3c769b3cae05dbc9b.png)

The loaded actual scene sits in memory, but we don’t use it. @sebavan, do we have any samples for how to “change” the current active scene? It seems that appending is the “preferred” way to handle scene management, but I’m not sure if we have too many examples for how to properly mange multiple scenes at a time.

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [April 14, 2020, 6:25pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/9 "2020-04-14T18:25:35Z")

</div>

In the playground you should not change the current scene or you would need to render 2 of them per frame with engine.runRenderLoop()

---

<div class="post-metadata">

**Author:** ![ncarr](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/ncarr/32/7646_2.png) [@ncarr](https://forum.babylonjs.com/u/ncarr)\
**Post date:** [April 15, 2020, 2:13pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/10 "2020-04-15T14:13:14Z")

</div>

So let me make sure I understand.

I need to Append and not Load?

This will merge the scene I am trying to load from firebase into the current scene.  
Logically if the current scene is nearly blank (just a camera). Then it will show the scene I am loading.

> The loaded actual scene sits in memory, but we don’t use it. @sebavan, do we have any samples for how to “change” the current active scene? It seems that appending is the “preferred” way to handle scene management, but I’m not sure if we have too many examples for how to properly mange multiple scenes at a time.

Part of my confusion here is because I have worked with THREEjs in the past and I was disposing of the default scene and loading the one from DB.

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [April 15, 2020, 2:27pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/11 "2020-04-15T14:27:24Z")

</div>

In the playground (as it only deals with one scene from the createScene function), it is preferable to append, and in your own app, as you control the render loop, it is entirely up to you 🙂

---

<div class="post-metadata">

**Author:** ![ncarr](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/ncarr/32/7646_2.png) [@ncarr](https://forum.babylonjs.com/u/ncarr)\
**Post date:** [April 15, 2020, 2:34pm UTC](https://forum.babylonjs.com/t/importing-and-exporting-a-scene/9697/12 "2020-04-15T14:34:06Z")

</div>

Thank you all for the assistance, I think I have a better understanding of what I need to do.
