diff --git a/src/components/fabric/QLine.js b/src/components/fabric/QLine.js index 02448cd7..d1e1ada3 100644 --- a/src/components/fabric/QLine.js +++ b/src/components/fabric/QLine.js @@ -72,13 +72,17 @@ export const QLine = fabric.util.createClass(fabric.Line, { setLength() { // Ensure all required properties are valid numbers - const { x1, y1, x2, y2 } = this; + const { x1, y1, x2, y2 } = this if (isNaN(x1) || isNaN(y1) || isNaN(x2) || isNaN(y2)) { - logger.error('Invalid coordinates in QLine:', { x1, y1, x2, y2 }); - this.length = 0; - return; + logger.error('Invalid coordinates in QLine:', { x1, y1, x2, y2 }) + this.length = 0 + return } - this.length = calcLinePlaneSize({ x1, y1, x2, y2 }) / 10; + this.length = calcLinePlaneSize({ x1, y1, x2, y2 }) / 10 + }, + + setLengthByValue(length) { + this.length = length / 10 }, addLengthText() { diff --git a/src/hooks/useLine.js b/src/hooks/useLine.js index 66dff769..c9de0194 100644 --- a/src/hooks/useLine.js +++ b/src/hooks/useLine.js @@ -10,7 +10,7 @@ import { } from '@/store/canvasAtom' import { QLine } from '@/components/fabric/QLine' import { basicSettingState } from '@/store/settingAtom' -import { calcLineActualSize } from '@/util/qpolygon-utils' +import { calcLineActualSizeByLineLength } from '@/util/qpolygon-utils' import { getDegreeByChon } from '@/util/canvas-util' import { useText } from '@/hooks/useText' import { fontSelector } from '@/store/fontAtom' @@ -181,7 +181,7 @@ export const useLine = () => { if (isVertical) { line.attributes = { ...line.attributes, - actualSize: calcLineActualSize(line, getDegreeByChon(pitch)), + actualSize: calcLineActualSizeByLineLength(lineLength, getDegreeByChon(pitch)), } } else if (isDiagonal) { const yLength = Math.abs(y2 - y1) * 10 @@ -195,7 +195,7 @@ export const useLine = () => { if (isHorizontal) { line.attributes = { ...line.attributes, - actualSize: calcLineActualSize(line, getDegreeByChon(pitch)), + actualSize: calcLineActualSizeByLineLength(lineLength, getDegreeByChon(pitch)), } } else if (isDiagonal) { const xLength = Math.abs(x2 - x1) * 10 diff --git a/src/hooks/usePolygon.js b/src/hooks/usePolygon.js index 011b8852..8822fd5f 100644 --- a/src/hooks/usePolygon.js +++ b/src/hooks/usePolygon.js @@ -1,7 +1,19 @@ -import { ANGLE_TYPE, canvasState, currentAngleTypeSelector, globalPitchState, pitchTextSelector } from '@/store/canvasAtom' +import { + ANGLE_TYPE, + canvasState, + currentAngleTypeSelector, + globalPitchState, + pitchTextSelector, +} from '@/store/canvasAtom' import { useRecoilValue } from 'recoil' import { fabric } from 'fabric' -import { calculateIntersection, findAndRemoveClosestPoint, getDegreeByChon, getDegreeInOrientation, isPointOnLine } from '@/util/canvas-util' +import { + calculateIntersection, + findAndRemoveClosestPoint, + getDegreeByChon, + getDegreeInOrientation, + isPointOnLine, +} from '@/util/canvas-util' import { QPolygon } from '@/components/fabric/QPolygon' import { isSamePoint, removeDuplicatePolygons } from '@/util/qpolygon-utils' import { basicSettingState, flowDisplaySelector } from '@/store/settingAtom' @@ -1958,6 +1970,38 @@ export const usePolygon = () => { canvas.renderAll() } + /** + * 폴리곤의 라인 길이가 10 이하로 차이나는 경우 작은 값으로 통일 + * @param polygon + */ + const unifyLineLengths = (polygon) => { + if (!polygon.lines || polygon.lines.length === 0) { + return + } + + const lines = polygon.lines + + for (let i = 0; i < lines.length; i++) { + for (let j = i + 1; j < lines.length; j++) { + const length1 = lines[i].getLength() + const length2 = lines[j].getLength() + const diff = Math.abs(length1 - length2) + + if (diff > 0 && diff <= 10) { + const minLength = Math.min(length1, length2) + if (length1 > length2) { + lines[i].setLengthByValue(minLength) + } else { + lines[j].setLengthByValue(minLength) + } + } + } + } + + addLengthText(polygon) + canvas.renderAll() + } + /** * 폴리곤의 라인 속성을 복도치수, 실제치수에 따라 actualSize 설정 * @param polygon @@ -1966,7 +2010,7 @@ export const usePolygon = () => { if (!polygon.lines || polygon.lines.length === 0 || !polygon.roofMaterial) { return } - + unifyLineLengths(polygon) polygon.lines.forEach((line) => { setActualSize(line, polygon.direction, +polygon.roofMaterial?.pitch) }) @@ -1983,5 +2027,6 @@ export const usePolygon = () => { splitPolygonWithLines, splitPolygonWithSeparate, setPolygonLinesActualSize, + unifyLineLengths, } } diff --git a/src/util/qpolygon-utils.js b/src/util/qpolygon-utils.js index abcd66ce..e1ff8575 100644 --- a/src/util/qpolygon-utils.js +++ b/src/util/qpolygon-utils.js @@ -5992,6 +5992,17 @@ export const calcLineActualSize = (points, degree = 0) => { return Big(planeSize).div(theta).round().toNumber() } +/** + * 포인트와 기울기를 기준으로 선의 길이를 구한다. + * @param lineLength + * @param degree + * @returns number + */ +export const calcLineActualSizeByLineLength = (lineLength, degree = 0) => { + const theta = Big(Math.cos(Big(degree).times(Math.PI).div(180))) + return Big(lineLength).div(theta).round().toNumber() +} + export const createLinesFromPolygon = (points) => { const lines = [] for (let i = 0; i < points.length; i++) {