Get things positioned in the right spot

script.js

@@ -1,7 +1,9 @@
 const scene = new THREE.Scene();
 const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
-const home = new THREE.Group();
+let homeContainer = new THREE.Group()
-scene.add(home)
+scene.add(homeContainer)
+let home = new THREE.Group()
+homeContainer.add(home)
 
 const renderer = new THREE.WebGLRenderer();
 renderer.setSize( window.innerWidth, window.innerHeight );
@@ -14,13 +16,16 @@ scene.add(light)
 // back the camera up
 camera.position.z = 25
 
-// transform the home to be a reasonable orientation
+// flip home on x axis
-home.rotation.x = Math.PI * 2/3
+home.rotation.x = Math.PI
+
+// Rotate container a bit for comfort
+homeContainer.rotation.x = 0.6 * (-Math.PI / 2)
 
 function animate() {
     requestAnimationFrame( animate );
 
-    home.rotation.z += 0.005;
+    homeContainer.rotation.z += 0.005;
 
     renderer.render( scene, camera );
 };
@@ -40,6 +45,11 @@ function setPosition(mesh, x, y, z, w, h, d) {
 }
 
 function configureScene(data) {
+    var minX = 1000
+    var maxX = -1000
+    var minY = minX
+    var maxY = maxX
+
     // Add geometry for the rooms
     for (var room of data.rooms) {
         let roomGeo = new THREE.BoxGeometry(room.w, room.h, room.d)
@@ -49,7 +59,17 @@ function configureScene(data) {
         setPosition(roomMesh, room.x, room.y, room.z || 0, room.w, room.h, room.d)
         roomMesh.userData = room.name
         home.add(roomMesh)
+
+        minX = Math.min(minX, room.x)
+        minY = Math.min(minY, room.y)
+
+        maxX = Math.max(maxX, room.x + room.w)
+        maxY = Math.max(maxY, room.y + room.h)
     }
+    let xExtent = maxX - minX
+    let yExtent = maxY - minY
+    home.position.x = -1 * (xExtent / 2)
+    home.position.y = +1 * (yExtent / 2)
 }
 
 async function doLoad() {