BabylonJS - Viewports

HTML

<script src="https://rawgithub.com/BabylonJS/Babylon.js/v1.8.5/babylon.1.8.5.js"></script>
<canvas id="renderCanvas"></canvas>

CSS

#renderCanvas {
    width: 100%;
    height: 100%;
    min-height: 100%;
}

JavaScript

if (BABYLON.Engine.isSupported()) {
    var canvas = document.getElementById("renderCanvas");
    var engine = new BABYLON.Engine(canvas, true);
    var scene = new BABYLON.Scene(engine);
    
    var camera = new BABYLON.FreeCamera("Camera", new BABYLON.Vector3(0, 0, -10), scene);
    var camera2 = new BABYLON.FreeCamera("Camera2", new BABYLON.Vector3(0, 0, -10), scene);
    
    camera.viewport = new BABYLON.Viewport(0, 0, 1.0, 1.0);
    camera2.viewport = new BABYLON.Viewport(0.8, 0.8, 0.2, 0.2);
    
    scene.activeCameras.push(camera);
    scene.activeCameras.push(camera2);
    
    
    var light = new BABYLON.PointLight("Omni0", new BABYLON.Vector3(0, 100, 100), scene);
    var cube = BABYLON.Mesh.CreateBox("Box", 2, scene);
   
    var alpha = 0;
    cube.scaling.x = 0.5;
    cube.scaling.z = 3.5;
    scene.beforeRender = function() {
        cube.rotation.x = alpha;
        cube.rotation.y = alpha;
    
        alpha += 0.01;
    };
    
    // Material
    var material = new BABYLON.StandardMaterial("default", scene);
    material.emissiveColor = new BABYLON.Color3(0.3, 0.3, 0.5);
    cube.material = material;
    
    // Render loop
    var renderLoop = function () {
        scene.render();
    };
    
    // Launch render loop
    engine.runRenderLoop(renderLoop);
}