Scene Management

Here you find all available actions for the scene. You can adjust the environment and fetch a list of all nodes in the scene.

scene.environment

Set the environment of the scene. This will overwrite the current environment. You can find a list of all available parameters in the Babylon.js IEnvironmentHelperOptions documentation.

SET scene.environment(options?: Object): Promise<void>

API

api.scene
	.environment({
		backgroundYRotation: Math.PI,
		cameraContrast: 2, // default: 1.6
		cameraExposure: 1, // default: 0.6
		createGround: true, // default: true
		createSkybox: true, // default: true *not working*
		enableGroundMirror: true, // default: true
		enableGroundShadow: false, // default: true *not working*
		environmentTexture: 'https://assets.babylonjs.com/environments/environmentSpecular.env',
		// groundColor: [0.5, 0.5, 0.5], // default: new Color3(0.2, 0.2, 0.3).toLinearSpace(scene.getEngine().useExactSrgbConversions).scale(3)
		groundMirrorAmount: 0.5, // default: 1
		groundMirrorBlurKernel: 64, // default: 64
		groundMirrorFallOffDistance: 0, // default: 0
		groundMirrorFresnelWeight: 1, // default: 1
		groundMirrorSizeRatio: 0.3, // default: 0.3
		groundMirrorTextureType: 0, // default: 0
		groundOpacity: 0.9, // default: 0.9
		groundShadowLevel: 0.5, // default: 0.5
		groundSize: 15, // default: 15
		groundTexture: 'https://assets.babylonjs.com/environments/backgroundGround.png',
		groundYBias: 0.00001, // default: 0.00001
		// rootPosition: [0, 0, 0], // default: Vector3.Zero()
		setupImageProcessing: true, // default: true
		sizeAuto: true, // default: true
		// skyboxColor: [0.5, 0.5, 0.5], // default: new Color3(0.2, 0.2, 0.3).toLinearSpace(scene.getEngine().useExactSrgbConversions).scale(3)
		skyboxSize: 20, // default: 20
		skyboxTexture: 'https://assets.babylonjs.com/environments/backgroundSkybox.dds',
		toneMappingEnabled: true, // default: true
	})

scene.mainColor

Set the main color of the scene. This will change the color of the ground and the skybox. See the Babylon.js EnvironmentHelper.setMainColor documentation for more information.

SET scene.mainColor(color?: string | [r: number, g: number, b: number]): Promise<void>

API

api.scene.mainColor('#ff0000')

JSON5

actions: [{ name: 'scene.mainColor', arg: '#ff0000' }]

scene.nodes

This will return an array of all nodes in the scene. For each node the name, id and type will be returned.

GET scene.nodes(): Promise<Array>

API

api.scene.nodes().then((result) => console.log(result))
// [
//	{ name: 'nodeAbc', id: 'id123', type: 'Mesh' }
//	{ name: 'nodeDef', id: 'id456', type: 'Mesh' }
//	{ name: 'nodeGhi', id: 'id789', type: 'Light' }
// ]

JSON5

actions: [{ name: 'scene.nodes' }]

scene.animate

Create and start animation for a node. You can define an animation by passing an object with the following properties: node, prop, range and frames.

• The node property defines the name of the node.
• The prop property defines the property of the node that should be animated.
• The range property defines the range of the animation.
• The frames property defines an array of keyframes. Each keyframe is an object with the following properties: frame, value.
• The frame property defines the frame number of the keyframe.
• The value property defines the value of the keyframe.

Todo: easingFunction The easingFunction property defines the easing function of the keyframe. You can find a list of all available easing functions in the Babylon.js easing functions documentation.

After the animation is created, it will be started automatically and the promise will resolve when the animation is finished.

SET scene.animate(animation: Object): Promise<void>

API

api.scene
	.animate({
		node: 'node-name',
		prop: 'rotation.y',
		range: [0, 60],
		frames: [
			{ frame: 0, value: 0 },
			{ frame: 100, value: 1 },
		],
	})
	.then((result) => console.log('Animation finished'))

JSON5

actions: [
	{
		name: 'scene.animate',
		arg: {
			node: 'node-name',
			prop: 'rotation.y',
			range: [0, 60],
			frames: [
				{ frame: 0, value: 0 },
				{ frame: 100, value: 1 },
			],
		},
	},
]