src/components/fabric/QPolygon.js

@@ -237,13 +237,9 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
    */
   drawHelpLine(settingModalFirstOptions) {
     /* innerLines 초기화 */
-    this.canvas
+    this.innerLines.forEach((line) => {
-      .getObjects()
-      .filter((obj) => obj.parentId === this.id && obj.name !== POLYGON_TYPE.WALL && obj.name !== POLYGON_TYPE.ROOF)
-      .forEach((obj) => this.canvas.remove(obj))
-    /*this.innerLines.forEach((line) => {
       this.canvas.remove(line)
-    })*/
+    })
     this.canvas.renderAll()
 
     let textMode = 'plane'

src/hooks/roofcover/useMovementSetting.js

@@ -322,23 +322,8 @@ export function useMovementSetting(id) {
     const wall = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.WALL && obj.attributes.roofId === roofId)
     const baseLines = wall.baseLines
     let targetBaseLines = []
-    let isGableRoof
+
     if (typeRef.current === TYPE.FLOW_LINE) {
-      const gableType = [LINE_TYPE.WALLLINE.GABLE, LINE_TYPE.WALLLINE.HIPANDGABLE]
-      if (baseLines.find((line) => gableType.includes(line.attributes.type))) {
-        isGableRoof = true
-        let gableStartIndex = baseLines.findIndex((line) => gableType.includes(line.attributes.type))
-        baseLines.forEach((line, index) => {
-          if (isGableRoof) {
-            const isEvenLine = (index - gableStartIndex) % 2 === 0
-            if (isEvenLine && !gableType.includes(line.attributes.type)) {
-              isGableRoof = false
-            }
-          }
-        })
-      } else {
-        isGableRoof = false
-      }
       const lineVector =
         target.y1 === target.y2
           ? FLOW_LINE_REF.UP_RIGHT_RADIO_REF.current.checked
@@ -347,62 +332,27 @@ export function useMovementSetting(id) {
           : FLOW_LINE_REF.UP_RIGHT_RADIO_REF.current.checked
             ? 'right'
             : 'left'
-      let checkBaseLines, currentBaseLines
       switch (lineVector) {
         case 'up':
-          checkBaseLines = baseLines.filter((line) => line.y1 === line.y2 && line.y1 < target.y1)
-          currentBaseLines = checkBaseLines.filter((line) => {
-            const minX = Math.min(target.x1, target.x2)
-            const maxX = Math.max(target.x1, target.x2)
-            return minX <= line.x1 && line.x1 <= maxX && minX <= line.x2 && line.x2 <= maxX
-          })
-          if (isGableRoof && currentBaseLines.length > 0) {
-            currentBaseLines.forEach((line) => targetBaseLines.push({ line, distance: Big(line.y1).minus(target.y1).abs().toNumber() }))
-          } else {
-            checkBaseLines.forEach((line) => targetBaseLines.push({ line, distance: Big(target.y1).minus(line.y1).abs().toNumber() }))
-          }
           baseLines
             .filter((line) => line.y1 === line.y2 && line.y1 < target.y1)
             .forEach((line) => targetBaseLines.push({ line, distance: Big(target.y1).minus(line.y1).abs().toNumber() }))
           break
         case 'down':
-          checkBaseLines = baseLines.filter((line) => line.y1 === line.y2 && line.y1 > target.y1)
+          baseLines
-          currentBaseLines = checkBaseLines.filter((line) => {
+            .filter((line) => line.y1 === line.y2 && line.y1 > target.y1)
-            const minX = Math.min(target.x1, target.x2)
+            .forEach((line) => targetBaseLines.push({ line, distance: Big(line.y1).minus(target.y1).abs().toNumber() }))
-            const maxX = Math.max(target.x1, target.x2)
-            return minX <= line.x1 && line.x1 <= maxX && minX <= line.x2 && line.x2 <= maxX
-          })
-          if (isGableRoof && currentBaseLines.length > 0) {
-            currentBaseLines.forEach((line) => targetBaseLines.push({ line, distance: Big(line.y1).minus(target.y1).abs().toNumber() }))
-          } else {
-            checkBaseLines.forEach((line) => targetBaseLines.push({ line, distance: Big(line.y1).minus(target.y1).abs().toNumber() }))
-          }
           break
         case 'right':
-          checkBaseLines = baseLines.filter((line) => line.x1 === line.x2 && line.x1 > target.x1)
+          baseLines
-          currentBaseLines = checkBaseLines.filter((line) => {
+            .filter((line) => line.x1 === line.x2 && line.x1 > target.x1)
-            const minY = Math.min(target.y1, target.y2)
+            .forEach((line) => targetBaseLines.push({ line, distance: Big(target.x1).minus(line.x1).abs().toNumber() }))
-            const maxY = Math.max(target.y1, target.y2)
+
-            return minY <= line.y1 && line.y1 <= maxY && minY <= line.y2 && line.y2 <= maxY
-          })
-          if (isGableRoof && currentBaseLines.length > 0) {
-            currentBaseLines.forEach((line) => targetBaseLines.push({ line, distance: Big(line.x1).minus(target.x1).abs().toNumber() }))
-          } else {
-            checkBaseLines.forEach((line) => targetBaseLines.push({ line, distance: Big(target.x1).minus(line.x1).abs().toNumber() }))
-          }
           break
         case 'left':
-          checkBaseLines = baseLines.filter((line) => line.x1 === line.x2 && line.x1 < target.x1)
+          baseLines
-          currentBaseLines = checkBaseLines.filter((line) => {
+            .filter((line) => line.x1 === line.x2 && line.x1 < target.x1)
-            const minY = Math.min(target.y1, target.y2)
+            .forEach((line) => targetBaseLines.push({ line, distance: Big(line.x1).minus(target.x1).abs().toNumber() }))
-            const maxY = Math.max(target.y1, target.y2)
-            return minY <= line.y1 && line.y1 <= maxY && minY <= line.y2 && line.y2 <= maxY
-          })
-          if (isGableRoof && currentBaseLines.length > 0) {
-            currentBaseLines.forEach((line) => targetBaseLines.push({ line, distance: Big(line.x1).minus(target.x1).abs().toNumber() }))
-          } else {
-            checkBaseLines.forEach((line) => targetBaseLines.push({ line, distance: Big(target.x1).minus(line.x1).abs().toNumber() }))
-          }
           break
       }
     } else {
@@ -438,6 +388,7 @@ export function useMovementSetting(id) {
 
       const inPolygon = wall.inPolygon(checkPoint)
 
+      console.log('inPolygon', inPolygon)
       if (UP_DOWN_REF.UP_RADIO_REF.current.checked && inPolygon) {
         value = value.neg()
       } else if (UP_DOWN_REF.DOWN_RADIO_REF.current.checked && !inPolygon) {

src/util/qpolygon-utils.js

@@ -850,6 +850,22 @@ export const drawRidgeRoof = (roofId, canvas, textMode) => {
   /** baseLine을 기준으로 확인용 polygon 작성 */
   const checkWallPolygon = new QPolygon(baseLinePoints, {})
 
+  // /**
+  //  * 외벽선이 시계방향인지 시계반대 방향인지 확인
+  //  * @type {boolean}
+  //  */
+  // let counterClockwise = true
+  // let signedArea = 0
+  //
+  // baseLinePoints.forEach((point, index) => {
+  //   const nextPoint = baseLinePoints[(index + 1) % baseLinePoints.length]
+  //   signedArea += point.x * nextPoint.y - point.y * nextPoint.x
+  // })
+  //
+  // if (signedArea > 0) {
+  //   counterClockwise = false
+  // }
+
   const drawEavesFirstLines = []
   const drawEavesSecondLines = []
   const drawGableRidgeFirst = []