add polygonToLine

src/hooks/useMode.js

@@ -416,7 +416,6 @@ export function useMode() {
 
     // 새로운 다각형 객체를 캔버스에 추가합니다.
     canvas.add(polygon)
-    // polygon.drawOuterLine(50)
 
     // 캔버스를 다시 그립니다.
     if (!otherLines) {
@@ -800,6 +799,42 @@ export function useMode() {
     makePolygon(offsetPoints)
   }
 
+  const togglePolygonLine = (obj) => {
+    const rtnLines = []
+    if (obj.type === 'QPolygon') {
+      const points = obj.getCurrentPoints()
+      points.forEach((point, index) => {
+        const nextPoint = points[(index + 1) % points.length] // 마지막 점이면 첫 번째 점으로 연결
+        const line = new QLine([point.x, point.y, nextPoint.x, nextPoint.y], {
+          stroke: 'black',
+          strokeWidth: 2,
+          selectable: false,
+          fontSize: fontSize, // fontSize는 필요에 따라 조정
+          parent: obj,
+        })
+        obj.visible = false
+        canvas.add(line)
+        rtnLines.push(line)
+      })
+
+      canvas.renderAll()
+    }
+    if (obj.type === 'QLine') {
+      const parent = obj.parent
+      canvas
+        ?.getObjects()
+        .filter((obj) => obj.parent === parent)
+        .forEach((obj) => {
+          rtnLines.push(obj)
+          canvas.remove(obj)
+        })
+
+      parent.visible = true
+      canvas.renderAll()
+    }
+    return rtnLines
+  }
+
   return {
     mode,
     changeMode,
@@ -808,5 +843,6 @@ export function useMode() {
     zoomIn,
     zoomOut,
     zoom,
+    togglePolygonLine,
   }
 }