diff --git a/src/components/fabric/QPolygon.js b/src/components/fabric/QPolygon.js index 20be0c35..d03b30c3 100644 --- a/src/components/fabric/QPolygon.js +++ b/src/components/fabric/QPolygon.js @@ -237,9 +237,13 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, { */ drawHelpLine(settingModalFirstOptions) { /* innerLines 초기화 */ - this.innerLines.forEach((line) => { + this.canvas + .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' diff --git a/src/hooks/roofcover/useMovementSetting.js b/src/hooks/roofcover/useMovementSetting.js index f05c8171..cbc69908 100644 --- a/src/hooks/roofcover/useMovementSetting.js +++ b/src/hooks/roofcover/useMovementSetting.js @@ -322,8 +322,23 @@ 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 @@ -332,27 +347,62 @@ 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': - baseLines - .filter((line) => line.y1 === line.y2 && line.y1 > target.y1) - .forEach((line) => targetBaseLines.push({ line, distance: Big(line.y1).minus(target.y1).abs().toNumber() })) + 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(line.y1).minus(target.y1).abs().toNumber() })) + } break case 'right': - baseLines - .filter((line) => line.x1 === line.x2 && line.x1 > target.x1) - .forEach((line) => targetBaseLines.push({ line, distance: Big(target.x1).minus(line.x1).abs().toNumber() })) - + checkBaseLines = baseLines.filter((line) => line.x1 === line.x2 && line.x1 > target.x1) + currentBaseLines = checkBaseLines.filter((line) => { + const minY = Math.min(target.y1, target.y2) + 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': - baseLines - .filter((line) => line.x1 === line.x2 && line.x1 < target.x1) - .forEach((line) => targetBaseLines.push({ line, distance: Big(line.x1).minus(target.x1).abs().toNumber() })) + checkBaseLines = baseLines.filter((line) => line.x1 === line.x2 && line.x1 < target.x1) + currentBaseLines = checkBaseLines.filter((line) => { + const minY = Math.min(target.y1, target.y2) + 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 { @@ -388,7 +438,6 @@ 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) { diff --git a/src/util/qpolygon-utils.js b/src/util/qpolygon-utils.js index 3f71712c..433b58a7 100644 --- a/src/util/qpolygon-utils.js +++ b/src/util/qpolygon-utils.js @@ -744,22 +744,6 @@ 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 = []