Babylon.js Viewer - Model Natural Lighting

Questions
1

Hello

I’m using babylon model viewer.

I extend minimal configuration as below

{
"templates": {
    "loadingScreen": {
        "params": {
            "backgroundColor": "#FFFFF"
        }
    }
},
"scene": {
    "clearColor": {
        "r": 1,
        "g": 1,
        "b": 1
    }
},
"camera": {
    "behaviors": {
        "autoRotate": {
            "type": 0
        },
        "framing": {
            "type": 2,
            "zoomOnBoundingInfo": true,
            "zoomStopsAnimation": false
        },
        "bouncing": {
            "type": 0
        }
    }
},
"engine": {
    "antialiasing": true
}

}

With the above configuration, I have model lighting as below

I would like to have the same lighting as the “extended” configuration, but I don’t want to extend the “extended” configuration as I don’t want to use ground, skybox etc. As below, or at least bright model without ambient shadows bottom etc.

I copied lighting configuration variables from the “extended” configuration and copied them into my configuration but unfortunately, it made the lightings darker.

Thank you in advance

2

The simplest way is to use the configuration which is good for you and simply dispose ground with shadows and skybox.

3

Hi @labris, thank you for your answer.

If I extend extended configuration, I can’t dispose of skybox and ground.

Because if I use extended config as below, and override it with my configuration I can’t dispose of the fields that are already included in the extended configuration.

<babylon id="babylon-viewer" extends="extended" configuration="/model-viewer-config.json">

I guess the reason because, the viewer configuration uses deepmerge for extension so, I only can override fields to extend the configuration but can’t get rid of fields.

4

You may just disable background and skybox like:

<babylon model="https://playground.babylonjs.com/scenes/Rabbit.babylon" skybox="false" ground="false"></babylon>

2 Likes
5

Thank you @labris, it worked. But now unfortunately I see the navbar Babylon.js logo and full-screen button. Also, the loading spinner is overridden by the default config.

I will try to override the loading image but what about disabling the navbar that default config provides?

6

Actually as I said, I override the navbar and loading templates then issue is resolved :slight_smile:

7

You can just disable the navbar - https://codepen.io/raananw/pen/gOwBMEB

1 Like