sk line angle

src/util/skeleton-utils.js

@@ -508,13 +508,15 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
   const addLines = []
   const existingLines = new Set(); // 이미 추가된 라인을 추적하기 위한 Set
 
-  const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine' && obj.attributes.roofId === roofId)
+  //처마라인
-  const  baseLines = canvas.getObjects().filter((obj) => obj.name === 'baseLine' && obj.parentId === roofId)
+  const roofLines = roof.lines
+  //벽라인
+  const wallLines = wall.lines
 
   skeletonLines.forEach(sktLine => {
     let { p1, p2, attributes, lineStyle } = sktLine;
 
-    // 라인을 고유하게 식별할 수 있는 키 생성 (정규화된 좌표로 정렬하여 비교)
+    // 중복방지 - 라인을 고유하게 식별할 수 있는 키 생성 (정규화된 좌표로 정렬하여 비교)
     const lineKey = [
       [p1.x, p1.y].sort().join(','),
       [p2.x, p2.y].sort().join(',')
@@ -530,7 +532,7 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
       { x: sktLine.p2.x, y: sktLine.p2.y }
     );
 
-    const innerLine = new QLine([p1.x, p1.y, p2.x, p2.y], {
+    const skeletonLine = new QLine([p1.x, p1.y, p2.x, p2.y], {
       parentId: roof.id,
       fontSize: roof.fontSize,
       stroke: (sktLine.attributes.isOuterEdge)?'orange':lineStyle.color,
@@ -539,42 +541,42 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
       attributes: attributes,
       direction: direction,
       isBaseLine: sktLine.attributes.isOuterEdge,
-      lineName: (sktLine.attributes.isOuterEdge)?'outerLine': attributes.type,
+      lineName: (sktLine.attributes.isOuterEdge)?'roofLine': attributes.type,
       selectable:(!sktLine.attributes.isOuterEdge),
       roofId: roofId,
     });
 
 
-      canvas.add(innerLine);
+      canvas.add(skeletonLine);
-      innerLine.bringToFront();
+    skeletonLine.bringToFront();
       existingLines.add(lineKey); // 추가된 라인을 추적
 
-        const coordinateText = new fabric.Text(`(${Math.round(p1.x)}, ${Math.round(p1.y)})`, {
-          left: p1.x + 5, // 좌표점에서 약간 오른쪽으로 이동
-          top: p1.y - 20, // 좌표점에서 약간 위로 이동
-          fontSize: 13,
-          fill: 'red',
-          fontFamily: 'Arial',
-          selectable: true,
-          lockMovementX: false,
-          lockMovementY: false,
-          lockRotation: true,
-          lockScalingX: true,
-          lockScalingY: true,
-          name: 'lengthText'
-        })
 
-        canvas?.add(coordinateText)
         
     //skeleton 라인에서 처마선은 삭제
-    if(innerLine.lineName === 'outerLine'){
+    if(skeletonLine.lineName === 'roofLine'){
-      
+      const coordinateText = new fabric.Text(`(${Math.round(skeletonLine.x1)}, ${Math.round(skeletonLine.y1)})`, {
+        left: skeletonLine.x1 + 5, // 좌표점에서 약간 오른쪽으로 이동
+        top: skeletonLine.y1 - 20, // 좌표점에서 약간 위로 이동
+        fontSize: 13,
+        fill: 'red',
+        fontFamily: 'Arial',
+        selectable: true,
+        lockMovementX: false,
+        lockMovementY: false,
+        lockRotation: true,
+        lockScalingX: true,
+        lockScalingY: true,
+        name: 'lengthText'
+      })
+
+      canvas?.add(coordinateText)
     }else{
 
 
     }
 
-    innerLines.push(innerLine)
+    innerLines.push(skeletonLine)
    canvas.renderAll();
   });
 
@@ -584,12 +586,17 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
    //  let i = 0
    //const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine' && obj.attributes.roofId === roofId)
    let roofLineRects = canvas.getObjects().filter((obj) => obj.name === 'roofLineRect' && obj.roofId === roofId)
-   roofLineRects.forEach((roofLineRect) => {
+
+
+  roofLineRects.forEach((roofLineRect) => {
      canvas.remove(roofLineRect)
      canvas.renderAll()
    })
 
-   wall.baseLines.forEach((wallLine, index) => {
+
+  //wall.lines 는 기본 벽 라인
+  //wall.baseLine은 움직인라인
+  wall.lines.forEach((wallLine, index) => {
      console.log("wallLine:::::", wallLine, index)
      let p1,p2,p3, p4
      let idx = 0;
@@ -600,44 +607,88 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
      if (wallLine.endPoint.x !== wallLine.x2) wallLine.endPoint.x = wallLine.x2
      if (wallLine.endPoint.y !== wallLine.y2) wallLine.endPoint.y = wallLine.y2
      
-     const wallLineStartPoint = {x:wallLine.x1, y:wallLine.y1}
+    const wallLineStartPoint = {x:wallLine.x1, y:wallLine.y1}
-     const wallLineEndPoint = {x:wallLine.x2, y:wallLine.y2}
+    const wallLineEndPoint = {x:wallLine.x2, y:wallLine.y2}
-     
+    const moveLine = wall.baseLines[index] //이동한 wall 존재여부 (초기 wall line = base line)
-     for(const outerLine of outerLines){
 
-       if(isSamePoint(outerLine.startPoint, wallLineStartPoint) || isSamePoint(outerLine.endPoint, wallLineEndPoint)){
+    if(isSamePoint(moveLine.startPoint, wallLineStartPoint) && isSamePoint(moveLine.endPoint, wallLineEndPoint)){
-         console.log("outerLine1:::::", wallLine, idx)
+      console.log("outerLine1:::::", wallLine, idx)
-         isMoveLine = false;
+      isMoveLine = false;
-         break;
+    }
-       }
+
-     }
+
-     if(isMoveLine){
+
-      const currentOuterLines = canvas
+    if(isMoveLine){
+
+      //현재 움직인 처마라인
+      const currentRoofLines = canvas
         .getObjects()
-        .filter((obj) => obj.lineName === 'outerLine' && obj.roofId === roofId)
+        .filter((obj) => obj.lineName === 'roofLine' && obj.roofId === roofId)
 
-       const roofLine = roof.lines[index];
+
+
+       const moveLine = wall.baseLines[index]
+       const roofLine = roof.lines[index]
+
+
+      //roof 접점
        const p1RoofLine = findClosestRoofLine(wallLineStartPoint,roof.lines)
        const p2RoofLine = findClosestRoofLine(wallLineEndPoint,roof.lines)
-
+      //wall 접점
        const p1wallLine = findClosestRoofLine(wallLineStartPoint,wall.lines)
        const p2wallLine = findClosestRoofLine(wallLineEndPoint,wall.lines)
-
+      //move 접점
-       const p1outerLine = findClosestRoofLine(wallLineStartPoint, currentOuterLines)
+      const p1moveLine = findClosestRoofLine(moveLine.startPoint, currentRoofLines)
-       const p2outerLine = findClosestRoofLine(wallLineEndPoint, currentOuterLines)
+      const p2moveLine = findClosestRoofLine(moveLine.endPoint, currentRoofLines)
+      //wall move 접점
+       const p1outerLine = findClosestRoofLine(wallLineStartPoint, currentRoofLines)
+       const p2outerLine = findClosestRoofLine(wallLineEndPoint, currentRoofLines)
 
 
        console.log("p1RoofLineV",p1RoofLine)
        console.log("p2RoofLineV",p2RoofLine)
        console.log("p1wallLineV",p1wallLine)
        console.log("p2wallLineV",p2wallLine)
+      console.log("p1moveLineV",p1moveLine)
+      console.log("p2moveLineV",p2moveLine)
        console.log("p1outerLine",p1outerLine)
        console.log("p2outerLine",p2outerLine)
       // const outerLines= canvas.getObjects().filter((obj) => obj.name === 'outerLine' && obj.attributes.roofId === roofId)
       // const outerLine = outerLines[index]
       // canvas.remove(outerLine)
       // canvas.renderAll()
-       
+       if(Math.abs(p1moveLine.distance - p1outerLine.distance) < 0.1){
+         return
+       }
+
+      // Calculate vectors from moveLine endpoints to wall line
+      const v1 = {x: wallLine.x1 - moveLine.x1, y: wallLine.y1 - moveLine.y1};
+      const v2 = {x: wallLine.x2 - moveLine.x1, y: wallLine.y2 - moveLine.y1};
+      const v3 = {x: wallLine.x1 - moveLine.x2, y: wallLine.y1 - moveLine.y2};
+      const v4 = {x: wallLine.x2 - moveLine.x2, y: wallLine.y2 - moveLine.y2};
+
+      // Calculate dot products
+      const dot1 = v1.x * v2.x + v1.y * v2.y;  // For start point
+      const dot2 = v3.x * v4.x + v3.y * v4.y;  // For end point
+
+      const angles = [];
+      // Check right angles with tolerance
+      if (Math.abs(dot1) < 0.1) {
+        angles.push({
+          wall: wall,
+          endpoint: 'start',
+          point: {x: moveLine.x1, y: moveLine.y1}
+        });
+      }
+      if (Math.abs(dot2) < 0.1) {
+        angles.push({
+          wall: wall,
+          endpoint: 'end',
+          point: {x: moveLine.x2, y: moveLine.y2}
+        });
+      }
+
+      console.log("angels::::::::", angles)
 
     // currentOuterLines.forEach((line) => {
     //   line.set('stroke', 'green')   // 원하는 색으로 변경
@@ -649,7 +700,7 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
   // const candidates = canvas.getObjects().filter((obj) => obj.roofId === roofId)
   //  console.log('candidates', candidates.map((obj) => obj.lineName))
 
-       const addHelpLine = (roofLine, wallLine, outerLineA, outerLineB) => {
+       const addHelpLine = (roofLine, wallLine, outerLineA, outerLineB = null) => {
          //반시계방향
          const roofLineStartPoint = {x:roofLine.x1, y:roofLine.y1}
          const roofLineEndPoint = {x:roofLine.x2, y:roofLine.y2}
@@ -674,7 +725,7 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
 
        };
 
-       const addHelpLine2 = (roofLine, wallLine, outerLineA, outerLineB) => {
+       const addHelpLine2 = (roofLine, wallLine, outerLineA, outerLineB=null) => {
          //반시계방향
          const roofLineStartPoint = {x:roofLine.x1, y:roofLine.y1}
          const roofLineEndPoint = {x:roofLine.x2, y:roofLine.y2}
@@ -699,6 +750,213 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
 
        };
 
+      const addHelpLineBottom = (roofLine, wallLine, moveLine, outerLine, target) => {
+        //반시계방향
+        const roofLinePoint = (target === 'S') ? {x:roofLine.x1, y:roofLine.y1} : {x:roofLine.x2, y:roofLine.y2}
+        const moveLinePoint = (target === 'S') ? {x:moveLine.x1, y:moveLine.y1} : {x:moveLine.x2, y:moveLine.y2}
+
+        let newP1, newP2, newP3, newP4;
+
+          newP1 = roofLinePoint
+          newP3 = moveLinePoint
+          newP2 = {x:newP3.x, y: newP1.y}
+          newP4 = {x:newP1.x, y: (Math.abs(outerLine?.intersectionPoint.x - newP1.x) < 0.1) ? outerLine?.intersectionPoint.y : newP3.y}
+
+        return {newP1, newP2, newP3, newP4}
+
+      };
+
+      const addHelpLineTop = (roofLine, wallLine, moveLine, outerLine, target) => {
+        //반시계방향
+        const roofLinePoint = (target === 'S') ? {x:roofLine.x1, y:roofLine.y1} : {x:roofLine.x2, y:roofLine.y2}
+        const moveLinePoint = (target === 'S') ? {x:moveLine.x1, y:moveLine.y1} : {x:moveLine.x2, y:moveLine.y2}
+
+        let newP1, newP2, newP3, newP4;
+
+        newP1 = roofLinePoint
+        newP3 = moveLinePoint
+        newP2 = {x:newP3.x, y: newP1.y}
+        newP4 = {x:newP1.x, y: (Math.abs(outerLine?.intersectionPoint.x - newP1.x) < 0.1) ? outerLine?.intersectionPoint.y : newP3.y}
+
+        return {newP1, newP2, newP3, newP4}
+
+      };
+
+      const addHelpLineLeft = (roofLine, wallLine, moveLine, outerLine, target) => {
+        //반시계방향
+        const roofLinePoint = (target === 'S') ? {x:roofLine.x1, y:roofLine.y1} : {x:roofLine.x2, y:roofLine.y2}
+        const moveLinePoint = (target === 'S') ? {x:moveLine.x1, y:moveLine.y1} : {x:moveLine.x2, y:moveLine.y2}
+
+        let newP1, newP2, newP3, newP4;
+
+        newP1 = roofLinePoint
+        newP3 = moveLinePoint
+        newP2 = {x:newP1.x, y: newP3.y}
+        newP4 = {x:Math.abs(outerLine?.intersectionPoint.y - newP1.y) < 0.1 ? outerLine?.intersectionPoint.x : newP3.x, y:newP1.y}
+
+        return {newP1, newP2, newP3, newP4}
+
+      };
+
+      const addHelpLineRight = (roofLine, wallLine, moveLine, outerLine, target) => {
+        //반시계방향
+        const roofLinePoint = (target === 'S') ? {x:roofLine.x1, y:roofLine.y1} : {x:roofLine.x2, y:roofLine.y2}
+        const moveLinePoint = (target === 'S') ? {x:moveLine.x1, y:moveLine.y1} : {x:moveLine.x2, y:moveLine.y2}
+
+        let newP1, newP2, newP3, newP4;
+
+        newP1 = roofLinePoint
+        newP3 = moveLinePoint
+        newP2 = {x:newP1.x, y: newP3.y}
+        newP4 = {x:Math.abs(outerLine?.intersectionPoint.y - newP1.y) < 0.1 ? outerLine?.intersectionPoint.x : newP3.x, y:newP1.y}
+
+        return {newP1, newP2, newP3, newP4}
+
+      };
+
+      let isPolygon;
+
+      // Calculate the movement direction
+      const dx1 = wallLine.x1 - moveLine.x1;
+      const dy1 = wallLine.y1 - moveLine.y1;
+      const dx2 = wallLine.x2 - moveLine.x2;
+      const dy2 = wallLine.y2 - moveLine.y2;
+
+      // Determine movement direction
+      let moveDirection = 'none';
+
+// Check if it's a vertical wall line (x coordinates are equal)
+      if (Math.abs(wallLine.x1 - wallLine.x2) < 0.1) {
+        // For vertical lines, check x movement
+        if (dx1 > 0 || dx2 > 0) {
+          moveDirection = 'left';
+        } else if (dx1 < 0 || dx2 < 0) {
+          moveDirection = 'right';
+        }
+      }
+      // Check if it's a horizontal wall line (y coordinates are equal)
+      else if (Math.abs(wallLine.y1 - wallLine.y2) < 0.1) {
+        // For horizontal lines, check y movement
+        if (dy1 > 0 || dy2 > 0) {
+          moveDirection = 'top';
+        } else if (dy1 < 0 || dy2 < 0) {
+          moveDirection = 'bottom';
+        }
+      }
+      console.log(`Wall line moved ${moveDirection}`);
+
+
+      let changeLine
+      switch (moveDirection) {
+        case 'left':
+          // Handle left movement
+          if(p1moveLine.distance > p2moveLine.distance) {
+            changeLine = addHelpLineLeft(roofLine, wallLine, moveLine, p1moveLine, 'S')
+
+            console.log('p1moveLine.distance', p1moveLine.distance);
+          }else{
+            changeLine = addHelpLineLeft(roofLine, wallLine, moveLine, p2moveLine, 'E')
+            console.log('p2moveLine.distance', p2moveLine.distance);
+          }
+
+          p1 = changeLine.newP1
+          p2 = changeLine.newP2
+          p3 = changeLine.newP3
+          p4 = changeLine.newP4
+
+          canvas.remove(p1outerLine.line)
+          canvas.remove(p2outerLine.line)
+
+          isPolygon = true
+          // const testLine2 = new QLine([wallLine.x1, wallLine.y1, wallLine.x2, wallLine.y2], {
+          //   stroke: 'red',
+          //   strokeWidth: 10,
+          //   property: 'normal',
+          //   fontSize: 14,
+          // })
+          // const testLine = new QLine([moveLine.x1, moveLine.y1, moveLine.x2, moveLine.y2], {
+          //   stroke: 'yellow',
+          //   strokeWidth: 10,
+          //   property: 'normal',
+          //   fontSize: 14,
+          // })
+          // canvas.add(testLine2);
+          // canvas.add(testLine);
+          // canvas.renderAll()
+
+          break;
+        case 'right':
+
+          if(p1moveLine.distance > p2moveLine.distance) {
+            changeLine = addHelpLineRight(roofLine, wallLine, moveLine, p1moveLine, 'S')
+
+            console.log('p1moveLine.distance', p1moveLine.distance);
+          }else{
+            changeLine = addHelpLineRight(roofLine, wallLine, moveLine, p2moveLine, 'E')
+            console.log('p2moveLine.distance', p2moveLine.distance);
+          }
+
+          p1 = changeLine.newP1
+          p2 = changeLine.newP2
+          p3 = changeLine.newP3
+          p4 = changeLine.newP4
+
+          canvas.remove(p1outerLine.line)
+          canvas.remove(p2outerLine.line)
+
+          isPolygon = true
+          break;
+        case 'top':
+          // Handle upward movement
+          if(p1moveLine.distance > p2moveLine.distance) {
+            changeLine = addHelpLineTop(roofLine, wallLine, moveLine, p1moveLine, 'S')
+            console.log('p1moveLine.distance', p1moveLine.distance);
+          }else{
+            changeLine = addHelpLineTop(roofLine, wallLine, moveLine, p2moveLine, 'E')
+            console.log('p2moveLine.distance', p2moveLine.distance);
+          }
+
+          p1 = changeLine.newP1
+          p2 = changeLine.newP2
+          p3 = changeLine.newP3
+          p4 = changeLine.newP4
+
+          canvas.remove(p1outerLine.line)
+          canvas.remove(p2outerLine.line)
+
+          isPolygon = true
+          break;
+        case 'bottom':
+          // Handle downward movement
+          if(p1moveLine.distance > p2moveLine.distance) {
+            changeLine = addHelpLineBottom(roofLine, wallLine, moveLine, p1moveLine, 'S')
+            console.log('p1moveLine.distance', p1moveLine.distance);
+          }else{
+            changeLine = addHelpLineBottom(roofLine, wallLine, moveLine, p2moveLine, 'E')
+            console.log('p2moveLine.distance', p2moveLine.distance);
+          }
+
+          p1 = changeLine.newP1
+          p2 = changeLine.newP2
+          p3 = changeLine.newP3
+          p4 = changeLine.newP4
+
+          canvas.remove(p1outerLine.line)
+          canvas.remove(p2outerLine.line)
+
+          isPolygon = true
+          break;
+
+        default:
+          // No movement or movement is too small to detect
+          isPolygon = false
+          break;
+      }
+
+      console.log(`Wall line moved ${moveDirection}`);
+
+
+/*
       if(p1wallLine.distance > 0 && p2wallLine.distance === 0) {
 
           console.log("왼쪽 수평 / 오른쪽 수직")
@@ -712,6 +970,9 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
           canvas.remove(p1outerLine.line)
           canvas.remove(p2outerLine.line)
 
+        isPolygon = true
+
+
       }else if(p2wallLine.distance > 0 && p1wallLine.distance === 0) {
         console.log("오른쪽 수평 / 왼쪽 수직")
         const changeLine = addHelpLine2(roofLine, wallLine, p1outerLine, p2outerLine)
@@ -723,119 +984,84 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
 
         canvas.remove(p1outerLine.line)
         canvas.remove(p2outerLine.line)
-      }else if(p2wallLine.distance > 0 && p2wallLine.distance === 0) {
+        isPolygon = true
+      }else if(p1wallLine.distance > 0 && p2wallLine.distance > 0) {
 
-        console.log("1p1wallLine.distance", p1wallLine.distance);
+        if(p1wallLine.distance > p2wallLine.distance){
-        console.log("1p2wallLine.distance", p2wallLine.distance);
+          const changeLine = addHelpLine(roofLine, wallLine, p1outerLine, p2outerLine)
+          console.log("1왼쪽 수평 / 1오른쪽 수직")
+          console.log("1p1wallLine.distance", p1wallLine.distance);
 
+          p1 = changeLine.newP1
+          p2 = changeLine.newP2
+          p3 = changeLine.newP3
+          p4 = changeLine.newP4
+        }else{
+          const changeLine = addHelpLine2(roofLine, wallLine, p1outerLine, p2outerLine)
+          console.log("1오른쪽 수평 / 1왼쪽 수직")
+          console.log("1p2wallLine.distance", p2wallLine.distance);
+          p1 = changeLine.newP1
+          p2 = changeLine.newP2
+          p3 = changeLine.newP3
+          p4 = changeLine.newP4
+        }
+        isPolygon = true
 
       }else {
         console.log("p1wallLine.distance", p1wallLine.distance);
         console.log("p2wallLine.distance", p2wallLine.distance);
+
+        isPolygon = false
       }
-       // if(p1RoofLine.distance > 0 && p2RoofLine.distance === 0){
-       //   console.log("A:::")
-       //   p1 = roofLine.startPoint
-       //   p2 = roofLine.endPoint
-       //   p3 = wallLine.endPoint
-       //   p4 = wallLine.startPoint
-       //
-       // }else if(p1RoofLine.distance === 0 && p2RoofLine.distance > 0){
-       //   console.log("B:::")
-       //   p1 = roofLine.endPoint
-       //   p2 = roofLine.startPoint
-       //   p3 = wallLine.startPoint
-       //   p4 = wallLine.endPoint
-       //
-       // } else if(p1RoofLine.distance > 0 && p2RoofLine.distance > 0){
-       //   if(p1RoofLine.distance > p2RoofLine.distance){
-       //     console.log("C-1:::")
-       //     p1 = roofLine.startPoint
-       //     p2 = roofLine.endPoint
-       //     p3 = wallLine.endPoint
-       //     p4 = wallLine.startPoint
-       //
-       //     console.log("C-1-1:::",roofLine.startPoint, wallLineStartPoint, wallLine.endPoint, wallLine.x1, wallLine.x2)
-       //
-       //     p1 = {...roofLine.startPoint}
-       //     //wallLine.startLine은 변경된 라인이 아니라 이전 라인의 값을 가지고 있음  그래서 x1, x2 사용
-       //     p3 = {...wallLineStartPoint}
-       //     p2.x = p3.x
-       //     p2.y = p1.y
-       //     p4.x = p1.x
-       //     p4.y = (Math.abs(p1outerLine?.intersectionPoint.x - p1.x) < 0.1) ? p1outerLine?.intersectionPoint.y : p3.y
-       //
-       //    console.log("11111p1,p2:::::",p1, p2, p3,p4)
-       //    canvas.remove(p1outerLine.line)
-       //
-       //   }else{
-       //     console.log("C-2:::")
-       //     p1 = roofLine.endPoint
-       //     p2 = roofLine.startPoint
-       //     p3 = wallLine.startPoint
-       //     p4 = wallLine.endPoint
-       //
-       //     p1 = {...roofLine.endPoint}
-       //     //wallLine.startLine은 변경된 라인이 아니라 이전 라인의 값을 가지고 있음  그래서 x1, x2 사용
-       //     p3 = {...wallLineEndPoint}
-       //     p2.x = p3.x
-       //     p2.y = p1.y
-       //     p4.x = p1.x
-       //     p4.y = (Math.abs(p2outerLine?.intersectionPoint.x -  p1.x) < 0.1) ? p2outerLine?.intersectionPoint.y : p3.y
-       //     console.log("22222p1,p2:::::",p1, p2, p3,p4)
-       //     canvas.remove(p2outerLine.line)
-       //
-       //   }
 
+       // //targetLines를 p1, p2 로 바꾸고 싶다..
+       // const editLine = (targetLines, p1, p2) => {
+       //    targetLines.forEach((line) => {
+       //    line.set({
+       //      x1: p1.x,
+       //      y1: p1.y,
+       //      x2: p2.x,
+       //      y2: p2.y,
+       //    })
+       //
+       //    // QLine은 startPoint/endPoint도 쓰므로 같이 갱신
+       //    if (line.startPoint) {
+       //      line.startPoint.x = p1.x
+       //      line.startPoint.y = p1.y
+       //    }
+       //    if (line.endPoint) {
+       //      line.endPoint.x = p2.x
+       //      line.endPoint.y = p2.y
+       //    }
+       //
+       //    // originPoint 같은 커스텀 속성을 쓰면 여기도 맞춰줌
+       //    if (line.attributes?.originPoint) {
+       //      line.attributes.originPoint = { x1: p1.x, y1: p1.y, x2: p2.x, y2: p2.y }
+       //    }
+       //  })
+       //
+       //
+       //
+       //  canvas.requestRenderAll()
+       //  // 1) 고유 ID로 찾기
+       //  const lineToUpdate = targetLines.find((line) => line.id === someLineId)
+       //  if (lineToUpdate) { //특정라인인
+       //    lineToUpdate.set({
+       //      x1: newP1.x,
+       //      y1: newP1.y,
+       //      x2: newP2.x,
+       //      y2: newP2.y,
+       //    })
+       //    lineToUpdate.startPoint.x = newP1.x
+       //    lineToUpdate.startPoint.y = newP1.y
+       //    lineToUpdate.endPoint.x = newP2.x
+       //    lineToUpdate.endPoint.y = newP2.y
+       //    canvas.requestRenderAll()
+       //  }
+       //
+       // }
 
-       //targetLines를 p1, p2 로 바꾸고 싶다..
+       */
-       const editLine = (targetLines, p1, p2) => {
-          targetLines.forEach((line) => {
-          line.set({
-            x1: p1.x,
-            y1: p1.y,
-            x2: p2.x,
-            y2: p2.y,
-          })
-
-          // QLine은 startPoint/endPoint도 쓰므로 같이 갱신
-          if (line.startPoint) {
-            line.startPoint.x = p1.x
-            line.startPoint.y = p1.y
-          }
-          if (line.endPoint) {
-            line.endPoint.x = p2.x
-            line.endPoint.y = p2.y
-          }
-
-          // originPoint 같은 커스텀 속성을 쓰면 여기도 맞춰줌
-          if (line.attributes?.originPoint) {
-            line.attributes.originPoint = { x1: p1.x, y1: p1.y, x2: p2.x, y2: p2.y }
-          }
-        })
-
-       
-
-        canvas.requestRenderAll()
-        // 1) 고유 ID로 찾기
-        const lineToUpdate = targetLines.find((line) => line.id === someLineId)
-        if (lineToUpdate) { //특정라인인
-          lineToUpdate.set({
-            x1: newP1.x,
-            y1: newP1.y,
-            x2: newP2.x,
-            y2: newP2.y,
-          })
-          lineToUpdate.startPoint.x = newP1.x
-          lineToUpdate.startPoint.y = newP1.y
-          lineToUpdate.endPoint.x = newP2.x
-          lineToUpdate.endPoint.y = newP2.y
-          canvas.requestRenderAll()
-        }
-
-       }
-
-        
 
       const drawPolygon = (p1,p2,p3,p4) => {
           const rect = new QPolygon([p1, p2, p3, p4], {
@@ -851,8 +1077,9 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
                 canvas.add(rect)
                 canvas.renderAll()
       }
-
+       if(isPolygon){
-      drawPolygon( p1,p2,p3, p4)
+         drawPolygon( p1,p2,p3, p4)
+       }
       
        // const wallLine = wall.baseLines[roofLine.idx - 1];
 
@@ -2596,11 +2823,11 @@ export const getSelectLinePosition = (wall, selectLine, options = {}) => {
     const leftIsInside = checkPointInPolygon(leftTestPoint, wall);
     const rightIsInside = checkPointInPolygon(rightTestPoint, wall);
 
-    if (debug) {
+    // if (debug) {
-      console.log('수직선 테스트:');
+    //   console.log('수직선 테스트:');
-      console.log('  왼쪽 포인트:', leftTestPoint, '-> 내부:', leftIsInside);
+    //   console.log('  왼쪽 포인트:', leftTestPoint, '-> 내부:', leftIsInside);
-      console.log('  오른쪽 포인트:', rightTestPoint, '-> 내부:', rightIsInside);
+    //   console.log('  오른쪽 포인트:', rightTestPoint, '-> 내부:', rightIsInside);
-    }
+    // }
 
     // left 조건: 왼쪽이 외부, 오른쪽이 내부
     if (!leftIsInside && rightIsInside) {