diff --git a/src/components/utilities/zoneEditor/ZoneEditor.vue b/src/components/utilities/zoneEditor/ZoneEditor.vue
index 4abe323..023e583 100644
--- a/src/components/utilities/zoneEditor/ZoneEditor.vue
+++ b/src/components/utilities/zoneEditor/ZoneEditor.vue
@@ -79,12 +79,6 @@ const pos2 = tileToWorldXY(tiles, 1, 2)
 const pos3 = tileToWorldXY(tiles, 2, 1)
 console.log(pos)
 
-
-// center camera
-const centerY = (zone.height * zone.tileHeight) / 2
-const centerX = (zone.width * zone.tileWidth) / 2
-scene.cameras.main.centerOn(centerX, centerY)
-
 function placeTile(layer: TilemapLayer, x: number, y: number, tileType: string) {
   let tilesett = zone.getTileset(tileType) as Tileset;
   if (!tilesett) return
@@ -94,11 +88,6 @@ function placeTile(layer: TilemapLayer, x: number, y: number, tileType: string)
 
 placeTile(tiles, 0, 0, 'tile_1.png')
 
-onBeforeMount(() => {
-  // exampleTilesArray.forEach((row, y) => row.forEach((tile, x) => placeTile(tiles, x, y, 'tile_2.png')))
-  socket.connection.emit('gm:zone_editor:zone:request', { zoneId: socket.character.zoneId })
-})
-
 // Watch for changes in the zoneStore and update the layer
 // watch(
 //   () => zoneEditorStore.tiles,
@@ -154,10 +143,20 @@ function save() {
   })
 }
 
+onBeforeMount(() => {
+  // exampleTilesArray.forEach((row, y) => row.forEach((tile, x) => placeTile(tiles, x, y, 'tile_2.png')))
+  socket.connection.emit('gm:zone_editor:zone:request', { zoneId: socket.character.zoneId })
+})
+
 onBeforeUnmount(() => {
   zoneEditorStore.reset()
 })
 
+// center camera
+const centerY = (zone.height * zone.tileHeight) / 2
+const centerX = (zone.width * zone.tileWidth) / 2
+scene.cameras.main.centerOn(centerX, centerY)
+
 /**
  * Resources:
  * https://stackoverflow.com/questions/14488989/drawing-isometric-walls