BabylonJS Tutorial - Camera and Lighting

Good evening, habrauzer. I suggest you continue to familiarize yourself with the framework BabylonJS. In this article you will get acquainted with the existing cameras and types of lighting offered by this framework.

Cameras

In general, there are 9 types of cameras in BabylonJS, 7 of which I will describe below. Why 7? The eighth and ninth camera has no documentation at the time of writing the tutorial.

FreeCamera - free camera

var camera = new BABYLON.FreeCamera(“FreeCamera”, new BABYLON.Vector3(0, 1, -15), scene); 

ArcRotateCamera - a camera attached to a specific axis and rotating along it

 var camera = new BABYLON.ArcRotateCamera(“ArcRotareCamera”, 1, 0.8, 10, new BABYLON.Vector3(0, 0, 0), scene); 

Note: requires a foreign module hand.js
')
TouchCamera - camera for touch control

 var camera = new BABYLON.TouchCamera(“TouchCamera”, new BABYLON.Vector3(0, 1, -15), scene); 

Note: requires a foreign module hand.js

Follow Camera - tracking camera

 var camera = new BABYLON.FollowCamera(“FollowCamera”, new BABYLON.Vector3(0, 15, -45), scene); camera target = myMeshObject: //   

VirtualJoysticksCamera - camera control with a virtual joystick

 var camera = new BABYLON.VirtualJoysticksCamera(“VJ_Camera”, new BABYLON.Vector3(0, 1, -15), scene); 

AnaglyphCamera - camera for 3D glasses

 var camera = new BABYLON.AnagluphFreeCamera(“af_cam”, new BABYLON.Vector3(0, 1, -15); 0.333, scene); 

0.333 - offset between the right and left eye

GamepadCamera - camera controlled with joystick

 var camera = new BABYLON.GamepadCamera(“Camera”, new BABYLON.Vector3(0, 15, -45), scene); 

Shine

Only 4 light sources can be rendered on one stage and there are 4 of them in all :)

The Point Light - a point source of lighting

 var light0 = new BABYLON.PointLight(“Omni0”, new BABYLON.Vector3(1, 10, 1), scene); light0.diffuse = new BABYLON.Color3(1, 0, 0); light0.specular = new BABYLON.Color3(1, 1, 1); 

The Directional Light - light emitted everywhere

 var light0 = new BABYLON.DirectionalLight(“DirLight”, new BABYLON.Vector3(0, -1, 0), scene); light0.diffuse = new BABYLON.Color3(1, 0, 0); light0.specular = new BABYLON.Color3(1, 1, 1); 

The Spot Light - Spotlight

 var light0 = new BABYLON.SpotLight(“Spot0”, new BABYLON.Vector3(0, 30, -10), new BABYLON.Vector(0, 1, 0), 0.8, 2, scene); light0.diffuse = new BABYLON.Color3(1, 0, 0); light0.specular = new BABYLON.Color3(1, 1, 1); 

2 argument - position
3 argument - direction
4 argument - angle
5 argument - speed of light decay


The Himispheric Light - realistic lighting

 var light0 = new BABALON.HemisphereLight(“Hemi0”, new BABYLON.Vector3(0, 1, 0), scene); light0.diffuse = new BABYLON.Color3(1, 1, 1); light0.specular = new BABYLON.Color(1, 1, 1); light0.groundColor = new BABYLON.Color(0, 0, 0);