roof의 중앙 지점에서 모듈 스크린샷

src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx

@@ -120,7 +120,44 @@ export default function CircuitTrestleSetting({ id }) {
   const beforeCapture = (type) => {
     setCanvasZoom(100)
     canvas.set({ zoom: 1 })
-    canvas.viewportTransform = [1, 0, 0, 1, 0, 0]
+
+    // roof 객체들을 찾아서 중앙점 계산
+    const roofs = canvas.getObjects().filter((obj) => obj.name === 'roof')
+
+    if (roofs.length > 0) {
+      // 모든 roof의 x, y 좌표를 수집
+      const allPoints = []
+      roofs.forEach((roof) => {
+        if (roof.getCurrentPoints()) {
+          roof.getCurrentPoints().forEach((point) => {
+            allPoints.push({ x: point.x, y: point.y })
+          })
+        }
+      })
+
+      if (allPoints.length > 0) {
+        // 모든 점들의 중앙값 계산
+        const minX = Math.min(...allPoints.map((p) => p.x))
+        const maxX = Math.max(...allPoints.map((p) => p.x))
+        const minY = Math.min(...allPoints.map((p) => p.y))
+        const maxY = Math.max(...allPoints.map((p) => p.y))
+
+        const centerX = (minX + maxX) / 2
+        const centerY = (minY + maxY) / 2
+
+        // 캔버스 중앙으로 이동하기 위한 오프셋 계산
+        const canvasWidth = canvas.getWidth()
+        const canvasHeight = canvas.getHeight()
+        const offsetX = canvasWidth / 2 - centerX
+        const offsetY = canvasHeight / 2 - centerY
+
+        canvas.viewportTransform = [1, 0, 0, 1, offsetX, offsetY]
+      } else {
+        canvas.viewportTransform = [1, 0, 0, 1, 0, 0]
+      }
+    } else {
+      canvas.viewportTransform = [1, 0, 0, 1, 0, 0]
+    }
 
     const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
     const circuitNumberTexts = canvas.getObjects().filter((obj) => obj.name === 'circuitNumber')
@@ -139,40 +176,9 @@ export default function CircuitTrestleSetting({ id }) {
     // roof polygon들의 중간점 계산
     const roofPolygons = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF)
     let x, y
-    x = 0 //canvas.width / 2
-    y = 1000 //canvas.height / 2
-
-    /*if (roofPolygons.length > 0) {
-      let minX = Infinity,
-        minY = Infinity,
-        maxX = -Infinity,
-        maxY = -Infinity
-
-      roofPolygons.forEach((obj) => {
-        const boundingRect = obj.getBoundingRect()
-        minX = Math.min(minX, boundingRect.left)
-        minY = Math.min(minY, boundingRect.top)
-        maxX = Math.max(maxX, boundingRect.left + boundingRect.width)
-        maxY = Math.max(maxY, boundingRect.top + boundingRect.height)
-      })
-
-      x = (minX + maxX) / 2
-      y = (minY + maxY) / 2
-    } else {
-      // roof polygon이 없으면 기본 중앙점 사용
-      x = canvas.width / 2
-      y = canvas.height / 2
-    }
-
-    if (x > 1600) {
-      x = 0
-      y = 0
-    }
-    if (y > 1600) {
-      x = 0
-      y = 0
-    }*/
-
+    x = canvas.width / 2
+    y = canvas.height / 2
+    
     canvas.zoomToPoint(new fabric.Point(x, y), 0.4)
     changeFontSize('lengthText', '28')
     changeFontSize('circuitNumber', '28')