get bounding sphere of a scene

by jscastro76

HTML

<script src="https://threejs.org/build/three.js"></script>
	<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>
  
  <canvas id="myCanvas"/>

CSS

body {
			background-color: #fff;
			margin: 0px;
			overflow: hidden;
		}

JavaScript

var mesh, renderer,
		  scene,
		  controls,
		  camera,
		  container = document.getElementById('myCanvas');

		//RENDERER
		renderer = new THREE.WebGLRenderer({
		  canvas: container,
		  antialias: true
		});
		//renderer.setClearColor(0x000000);
		renderer.setPixelRatio(window.devicePixelRatio); //device pixel ratio
		renderer.setSize(window.innerWidth, window.innerHeight); //canvas size

		init();

		function init() {


		  scene = new THREE.Scene();
		  scene.background = new THREE.Color(0x999999);
		  var light = new THREE.AmbientLight(0x999999); // soft white light
		  scene.add(light);

    
      var spotLight = new THREE.SpotLight(),
    spotLightHelper = new THREE.SpotLightHelper(spotLight);
    spotLight.add(spotLightHelper);
    scene.add(spotLight);
 
    // set position of spotLight,
    // and helper bust be updated when doing that
    spotLight.position.set(100, 200, -100);
    spotLightHelper.update();
      
      
		  camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
		  camera.position.fromArray([-20, 10, -140]);
		  scene.add(camera);

		  controls = new THREE.OrbitControls(camera, container);

		  var cubeSize = 50
		  var boxGeometry = new THREE.BoxBufferGeometry(cubeSize, cubeSize, cubeSize);
		  var material = new THREE.MeshLambertMaterial({
		    color: 0xC9C9C9
		  });

		  var cube = new THREE.Mesh(boxGeometry, material);
		  cube.position.set(0, 25, 0);
		  scene.add(cube);

		  // I create a new cube and add it to the scene, but I can see no shading on this cube
		  var newCube = new THREE.Mesh(boxGeometry, material);
		  newCube.position.set(60, 25, 0);
		  scene.add(newCube);


		  //g.updateWorldMatrix(true);
		  var gridHelper = new THREE.GridHelper(400, 40, 0x0000ff, 0x808080);
		  gridHelper.position.y = 0;
		  gridHelper.position.x = 0;
		  scene.add(gridHelper);


		  render();
		}


		function render() {
		  requestAnimationFrame(render);

		  renderer.render(scene, camera);
		}