From 73105e8199e2a213811a52a73e99c6aa3e4536a2 Mon Sep 17 00:00:00 2001
From: "hyojun.choi" <chlgkwk123@nate.com>
Date: Thu, 14 Nov 2024 16:49:07 +0900
Subject: [PATCH] =?UTF-8?q?=EC=A7=80=EB=B6=95=EB=A9=B4=20=ED=95=A0?=
 =?UTF-8?q?=EB=8B=B9=20=EC=98=A4=EB=A5=98=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/fabric/QPolygon.js |  4 ++-
 src/hooks/usePolygon.js           | 54 ++++++++++++++++++++++++++++++-
 src/util/qpolygon-utils.js        |  8 +++--
 3 files changed, 62 insertions(+), 4 deletions(-)

diff --git a/src/components/fabric/QPolygon.js b/src/components/fabric/QPolygon.js
index a365a882..c5a08cf1 100644
--- a/src/components/fabric/QPolygon.js
+++ b/src/components/fabric/QPolygon.js
@@ -272,9 +272,11 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
     this.texts = []
     points.forEach((start, i) => {
       const end = points[(i + 1) % points.length]
+      // planeSize: Math.round(Math.sqrt(Math.pow(newLine.x1 - newLine.x2, 2) + Math.pow(newLine.y1 - newLine.y2, 2))) * 10,
+      //   actualSize: Math.round(Math.sqrt(Math.pow(newLine.x1 - newLine.x2, 2) + Math.pow(newLine.y1 - newLine.y2, 2))) * 10,
       const dx = end.x - start.x
       const dy = end.y - start.y
-      const length = Number(Math.sqrt(dx * dx + dy * dy).toFixed(1)) * 10
+      const length = Math.round(Math.sqrt(Math.pow(end.x - start.x, 2) + Math.pow(end.y - start.y, 2))) * 10
 
       let midPoint
 
diff --git a/src/hooks/usePolygon.js b/src/hooks/usePolygon.js
index b83d8b1a..56052379 100644
--- a/src/hooks/usePolygon.js
+++ b/src/hooks/usePolygon.js
@@ -675,6 +675,57 @@ export const usePolygon = () => {
     const roofs = []
 
     //polygonLines를 순회하며 innerLines와 교차하는 점을 line의 속성에 배열로 저장한다.
+    polygonLines.forEach((line) => {
+      let startPoint // 시작점
+      let endPoint // 끝점
+      if (line.x1 < line.x2) {
+        startPoint = { x: line.x1, y: line.y1 }
+        endPoint = { x: line.x2, y: line.y2 }
+      } else if (line.x1 > line.x2) {
+        startPoint = { x: line.x2, y: line.y2 }
+        endPoint = { x: line.x1, y: line.y1 }
+      } else {
+        if (line.y1 < line.y2) {
+          startPoint = { x: line.x1, y: line.y1 }
+          endPoint = { x: line.x2, y: line.y2 }
+        } else {
+          startPoint = { x: line.x2, y: line.y2 }
+          endPoint = { x: line.x1, y: line.y1 }
+        }
+      }
+
+      line.startPoint = startPoint
+      line.endPoint = endPoint
+    })
+    innerLines.forEach((line) => {
+      let startPoint // 시작점
+      let endPoint // 끝점
+      if (line.x1 < line.x2) {
+        startPoint = { x: line.x1, y: line.y1 }
+        endPoint = { x: line.x2, y: line.y2 }
+      } else if (line.x1 > line.x2) {
+        startPoint = { x: line.x2, y: line.y2 }
+        endPoint = { x: line.x1, y: line.y1 }
+      } else {
+        if (line.y1 < line.y2) {
+          startPoint = { x: line.x1, y: line.y1 }
+          endPoint = { x: line.x2, y: line.y2 }
+        } else {
+          startPoint = { x: line.x2, y: line.y2 }
+          endPoint = { x: line.x1, y: line.y1 }
+        }
+      }
+
+      line.startPoint = startPoint
+      line.endPoint = endPoint
+    })
+
+    polygonLines.forEach((line) => {
+      line.set({ strokeWidth: 10 })
+      canvas.add(line)
+    })
+    canvas.renderAll()
+
     polygonLines.forEach((line) => {
       const intersections = []
       innerLines.forEach((innerLine) => {
@@ -685,7 +736,7 @@ export const usePolygon = () => {
           intersections.push(innerLine.startPoint)
         }
         if (isPointOnLine(line, innerLine.endPoint)) {
-          if (isSamePoint(line.startPoint, innerLine.endPoint) || isSamePoint(line.startPoint, innerLine.endPoint)) {
+          if (isSamePoint(line.startPoint, innerLine.endPoint) || isSamePoint(line.endPoint, innerLine.endPoint)) {
             return
           }
           intersections.push(innerLine.endPoint)
@@ -696,6 +747,7 @@ export const usePolygon = () => {
 
     const divideLines = polygonLines.filter((line) => line.intersections.length > 0)
     let newLines = []
+
     divideLines.forEach((line) => {
       const { intersections, startPoint, endPoint } = line
 
diff --git a/src/util/qpolygon-utils.js b/src/util/qpolygon-utils.js
index a229d1a7..0fff3c09 100644
--- a/src/util/qpolygon-utils.js
+++ b/src/util/qpolygon-utils.js
@@ -2484,7 +2484,7 @@ const changeGableRoof = (currentRoof, canvas) => {
       const hip1Height = Math.round(hip1Base / Math.tan(((90 - prevDegree) * Math.PI) / 180))
       hip1.attributes.planeSize = Math.round(Math.sqrt(Math.pow(hip1.x1 - hip1.x2, 2) + Math.pow(hip1.y1 - hip1.y2, 2))) * 10
       hip1.attributes.actualSize = Math.round(Math.sqrt(Math.pow(hip1.attributes.planeSize, 2) + Math.pow(hip1Height, 2)))
-      roof.innerLines.push(hip1)
+      // roof.innerLines.push(hip1)
 
       let hip2 = new QLine([currentRoof.x2, currentRoof.y2, midX, midY], {
         fontSize: roof.fontSize,
@@ -2503,7 +2503,11 @@ const changeGableRoof = (currentRoof, canvas) => {
       const hip2Height = Math.round(hip2Base / Math.tan(((90 - nextDegree) * Math.PI) / 180))
       hip2.attributes.planeSize = Math.round(Math.sqrt(Math.pow(hip2.x1 - hip2.x2, 2) + Math.pow(hip2.y1 - hip2.y2, 2))) * 10
       hip2.attributes.actualSize = Math.round(Math.sqrt(Math.pow(hip2.attributes.planeSize, 2) + Math.pow(hip2Height, 2)))
-      roof.innerLines.push(hip2)
+      // roof.innerLines.push(hip2)
+      hip1.set({ visible: false })
+      hip1.setViewLengthText(false)
+      hip2.set({ visible: false })
+      hip2.setViewLengthText(false)
       canvas?.renderAll()
     }
   }