sk

src/hooks/roofcover/useMovementSetting.js

@@ -618,11 +618,13 @@ export function useMovementSetting(id) {
         value = value.neg()
       }
     } else {
-      //console.log("error::", UP_DOWN_REF)
+      console.log("error::", UP_DOWN_REF.POINTER_INPUT_REF.current.value)
-      value =
+      value = Big(
-        UP_DOWN_REF.FILLED_INPUT_REF.current.value !== ''
+        (UP_DOWN_REF?.FILLED_INPUT_REF?.current?.value?.trim() ||
-          ? Big(UP_DOWN_REF.FILLED_INPUT_REF.current.value)
+          UP_DOWN_REF?.POINTER_INPUT_REF?.current?.value?.trim() ||
-          : Big(UP_DOWN_REF.POINTER_INPUT_REF.current.value)
+          '0'
+        )
+      );
 
       const midX = Big(target.x1).plus(target.x2).div(2)
       const midY = Big(target.y1).plus(target.y2).div(2)

src/util/skeleton-utils.js

@@ -7,6 +7,7 @@ import Big from 'big.js'
 import { line } from 'framer-motion/m'
 import { QPolygon } from '@/components/fabric/QPolygon'
 import { point } from '@turf/turf'
+import { add } from 'mathjs'
 
 /**
  * 지붕 폴리곤의 스켈레톤(중심선)을 생성하고 캔버스에 그립니다.
@@ -429,6 +430,7 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
   const roof = canvas?.getObjects().find((object) => object.id === roofId)
   const wall = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.WALL && obj.attributes.roofId === roofId)
   let skeletonLines = []
+
   const processedInnerEdges = new Set()
 
   // 1. 모든 Edge를 순회하며 기본 스켈레톤 선(용마루)을 수집합니다.
@@ -499,11 +501,12 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
 
   // 3. 최종적으로 정리된 스켈레톤 선들을 QLine 객체로 변환하여 캔버스에 추가합니다.
   const innerLines = [];
+  const addLines = []
   const existingLines = new Set(); // 이미 추가된 라인을 추적하기 위한 Set
 
 
   skeletonLines.forEach(line => {
-    const { p1, p2, attributes, lineStyle } = line;
+    let { p1, p2, attributes, lineStyle } = line;
 
     // 라인을 고유하게 식별할 수 있는 키 생성 (정규화된 좌표로 정렬하여 비교)
     const lineKey = [
@@ -556,31 +559,92 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
       }
 
       if (!lineExists) {
-        // 같은 라인이 없으므로 새 다각형 라인 생성
+
-        const newLine = new QLine(
+        addLines.push(line);
-          [p1.x, p1.y, p2.x, p2.y],
+
-          {
+        console.log("addLines:::"+addLines)
-            parentId   : roof.id,
+
-            fontSize   : roof.fontSize,
-            stroke     : 'yellow',
-            strokeWidth: lineStyle.width,
-            name       : (line.attributes.isOuterEdge) ? 'eaves' : attributes.type,
-            attributes : attributes,
-            direction  : direction,
-            isBaseLine : line.attributes.isOuterEdge,
-            lineName   : (line.attributes.isOuterEdge) ? 'addLine' : attributes.type,
-            selectable : (!line.attributes.isOuterEdge),
-            roofId     : roofId,
-          }
-        );
         let p1Line = findClosestRoofLine(p1, roof.lines)
         let p2Line = findClosestRoofLine(p2, roof.lines)
-        if(p2Line.distance > p1Line.distance){
+        // if(p2Line.distance > p1Line.distance){
-          p1Line = p2Line;
+        //   p1Line = p2Line;
-          p2Line = p1Line;
+        //   p2Line = p1Line;
+        // }
+        // //x점이 만날때..
+        // if(Math.abs(p1.x - p1Line.line.startPoint.x) < 0.1) {
+        //   p1.y = p1Line.line.startPoint.y
+        // } else if(Math.abs(p1.x - p1Line.line.endPoint.x) < 0.1){
+        //   p1.y = p1Line.line.endPoint.y
+        // }
+        // //y점이 만날때
+        // if(Math.abs(p2.x - p2Line.line.startPoint.x) < 0.1) {
+        //   p2.y = p2Line.line.startPoint.y
+        // } else if(Math.abs(p2.x - p2Line.line.endPoint.x) < 0.1){
+        //   p2.y = p2Line.line.endPoint.y
+        // }
+
+        console.log("그리는 선::::",p1,p2)
+
+        console.log("그리는 선::::",p1Line,p2Line)
+
+        console.log("p1:", p1);
+        console.log("p1Line.intersectionPoint:", p1Line.intersectionPoint);
+        console.log("p2:", p2);
+        console.log("p2Line.intersectionPoint:", p2Line.intersectionPoint);
+
+        const isP1Same = isSamePoint(p1, p1Line.intersectionPoint);
+        const isP2Same = isSamePoint(p2, p2Line.intersectionPoint);
+        console.log("isP1Same:", isP1Same, "isP2Same:", isP2Same, "combined:", isP1Same && isP2Same);
+
+        if (isP1Same && isP2Same) {
+          console.log("Condition is true");
+        } else {
+          console.log("Condition is false");
         }
+        const xMatch = Math.abs(p1Line.intersectionPoint.x - p2Line.intersectionPoint.x) < 0.1;  // x 좌표가 일치하는지 (0.1 오차 허용)
+        const yMatch = Math.abs(p1Line.intersectionPoint.y - p2Line.intersectionPoint.y) < 0.1;  // y 좌표가 일치하는지 (0.1 오차 허용)
+
+        if(xMatch) {
+          console.log("xMatch:", xMatch);
+            p1.y = p2Line.intersectionPoint.y
+            //p2.y = p1Line.intersectionPoint.y
+
+        }else if(yMatch){
+          console.log("yMatch:", yMatch);
+            //p1.x = p2Line.intersectionPoint.x
+            p2.x = p1Line.intersectionPoint.x
+        }else{
+          console.log("No Match:");
+
+          //if(isHorizontal) {
+
+          const xMatch = Math.abs(p1.x - p2.x) < 0.1;  // x 좌표가 일치하는지 (0.1 오차 허용)
+          const yMatch = Math.abs(p1.y - p2.y) < 0.1;  // y 좌표가 일치하는지 (0.1 오차 허용)
+
+          if(yMatch){
+            p1.x = p1Line.intersectionPoint.x;
+            p1.y = p1Line.intersectionPoint.y;
+            p2.x = p1Line.intersectionPoint.x;
+            //p2.y = p2.y
+          }
+          if(xMatch){
+            p1.x = p2Line.intersectionPoint.x;
+            p1.y = p2Line.intersectionPoint.y;
+            //p2.x = p2.x
+            p2.y = p2Line.intersectionPoint.y;
+          }
+
+
+
+        }
+        console.log("New p1:", p1);
+
+        console.log("New p2:", p2);
+if( !xMatch && !yMatch) {
+  const lineId = `${p1.x},${p1.y}-${p2.x},${p2.y}`;
+
   const newLine2 = new QLine(
-          [p1Line.line.x1, p1Line.line.y1, p2Line.line.x2, p2Line.line.y2],
+    [p1.x, p1.y, p2.x, p2.y],
     {
       parentId   : roof.id,
       fontSize   : roof.fontSize,
@@ -590,16 +654,21 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
       attributes : attributes,
       direction  : direction,
       isBaseLine : line.attributes.isOuterEdge,
-            lineName   : (line.attributes.isOuterEdge) ? 'exLine' : attributes.type,
+      lineName   : (line.attributes.isOuterEdge) ? 'outerLine' : attributes.type,
       selectable : (!line.attributes.isOuterEdge),
       roofId     : roofId,
+      lineId: lineId
     }
   );
-        canvas.add(newLine);
+
   canvas.add(newLine2);
 }
 
 
+
+      }
+
+
       //초기외곽라인?
       const coordinateText = new fabric.Text(`(${Math.round(p1.x)}, ${Math.round(p1.y)})`, {
         left: p1.x + 5, // 좌표점에서 약간 오른쪽으로 이동
@@ -628,6 +697,8 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
    canvas.renderAll();
   });
 
+  // 같은 라인이 없으므로 새 다각형 라인 생성
+
   return innerLines;
 }
 
@@ -683,7 +754,7 @@ function processEavesEdge(roofId, canvas, skeleton, edgeResult, skeletonLines) {
 
     // 지붕 경계선과 교차 확인 및 클리핑
     const clippedLine = clipLineToRoofBoundary(p1, p2, roof.lines, roof.moveSelectLine);
-    console.log('clipped line', clippedLine.p1, clippedLine.p2);
+    //console.log('clipped line', clippedLine.p1, clippedLine.p2);
     const isOuterLine = isOuterEdge(clippedLine.p1, clippedLine.p2, [edgeResult.Edge])
     addRawLine(roof.id, skeletonLines, clippedLine.p1, clippedLine.p2, 'ridge', 'red', 5, pitch, isOuterLine);
    // }