diff --git a/src/main/resources/views/platform/zhghh5/democratic/teachercongress/guildhall/selectSeat/index.html b/src/main/resources/views/platform/zhghh5/democratic/teachercongress/guildhall/selectSeat/index.html
index 597bac6e..97c7e39a 100644
--- a/src/main/resources/views/platform/zhghh5/democratic/teachercongress/guildhall/selectSeat/index.html
+++ b/src/main/resources/views/platform/zhghh5/democratic/teachercongress/guildhall/selectSeat/index.html
@@ -627,7 +627,7 @@ layout("/layouts/platform_h5.html"){
     .seat-matrix-row {
         display: flex;
         width: max-content;
-        min-width: 100%;
+        min-width: 0;
         align-items: center;
     }
 
@@ -852,7 +852,7 @@ layout("/layouts/platform_h5.html"){
         --aisle-gap: 13px;
         --seat-row-height: 39px;
         width: max-content;
-        min-width: calc(100% - 30px);
+        min-width: 0;
         margin: 15px;
         padding: 0;
         overflow: visible;
@@ -1545,10 +1545,13 @@ layout("/layouts/platform_h5.html"){
                 const matrix = this.$refs.seatMatrix
                 if (!viewport || !matrix || typeof Panzoom !== 'function') return
 
+                const initialView = this.getSeatInitialView(viewport, matrix)
                 const instance = Panzoom(matrix, {
                     minScale: 0.7,
                     maxScale: 2,
-                    startScale: 1,
+                    startScale: initialView.scale,
+                    startX: initialView.x,
+                    startY: initialView.y,
                     canvas: true,
                     origin: '0 0'
                 })
@@ -1557,13 +1560,41 @@ layout("/layouts/platform_h5.html"){
                 matrix.addEventListener('panzoompan', this.handlePanzoomMove)
                 matrix.addEventListener('panzoomzoom', this.handlePanzoomMove)
                 matrix.addEventListener('panzoomend', this.handlePanzoomEnd)
-                this.syncSeatRowGuide({x: 0, y: 0, scale: 1})
+                this.syncSeatRowGuide(initialView)
                 this._seatPanzoom = instance
                 this._seatPanzoomViewport = viewport
                 this._seatPanzoomMatrix = matrix
                 this._seatPanzoomWheelHandler = wheelHandler
             },
 
+            getSeatInitialView(viewport, matrix) {
+                const rowCount = Number(this.seatConfig.rows) || 0
+                const colCount = Number(this.seatConfig.cols) || 0
+                const maxSize = Math.max(rowCount, colCount)
+                let scale = 1
+
+                if (maxSize <= 4) {
+                    scale = 1.45
+                } else if (maxSize <= 6) {
+                    scale = 1.25
+                } else if (maxSize <= 8) {
+                    scale = 1.1
+                } else if (maxSize >= 18) {
+                    scale = 0.98
+                } else if (maxSize >= 14) {
+                    scale = 1.05
+                }
+
+                const viewportWidth = viewport.clientWidth
+                const viewportHeight = viewport.clientHeight
+                const matrixWidth = matrix.offsetWidth
+                const matrixHeight = matrix.offsetHeight
+                const x = ((viewportWidth - matrixWidth * scale) / 2 - matrix.offsetLeft + 14) / scale
+                const y = ((viewportHeight - matrixHeight * scale) / 2 - matrix.offsetTop) / scale
+
+                return {x: x, y: y, scale: scale}
+            },
+
             destroySeatPanzoom() {
                 if (this._seatPanzoomViewport && this._seatPanzoomWheelHandler) {
                     this._seatPanzoomViewport.removeEventListener('wheel', this._seatPanzoomWheelHandler)