Merge pull request 'dev' (#463) from dev into dev-deploy

Reviewed-on: #463
This commit is contained in:
ysCha 2025-12-13 17:06:30 +09:00
commit 5215b6ac43
3 changed files with 44 additions and 20 deletions

View File

@ -1,4 +1,4 @@
import { useState, useEffect, useRef } from 'react'
import { useEffect, useRef, useState } from 'react'
import { useMessage } from '@/hooks/useMessage'
import WithDraggable from '@/components/common/draggable/WithDraggable'
import { useRecoilValue } from 'recoil'
@ -15,8 +15,8 @@ export default function DormerOffset(props) {
const { closePopup } = usePopup()
const [arrow1, setArrow1] = useState(null)
const [arrow2, setArrow2] = useState(null)
const arrow1LengthRef = useRef()
const arrow2LengthRef = useRef()
const arrow1LengthRef = useRef(0)
const arrow2LengthRef = useRef(0)
const [arrow1Length, setArrow1Length] = useState(0)
const [arrow2Length, setArrow2Length] = useState(0)
@ -59,12 +59,12 @@ export default function DormerOffset(props) {
name=""
label=""
className="input-origin block"
value={arrow1LengthRef.current.value}
value={arrow1LengthRef.current.value ?? 0}
ref={arrow1LengthRef}
onChange={(value) => setArrow1Length(value)}
options={{
allowNegative: false,
allowDecimal: false
allowDecimal: false,
}}
/>
</div>

View File

@ -29,22 +29,39 @@ fabric.Rect.prototype.getCurrentPoints = function () {
/**
* fabric.Group에 getCurrentPoints 메서드를 추가 (도머 그룹용)
* 그룹groupPoints를 다시 계산하여 반환
* 그룹 객체들의 점들을 수집하여 현재 월드 좌표를 반환
*/
fabric.Group.prototype.getCurrentPoints = function () {
// groupPoints를 다시 계산
// 그룹 내 객체들로부터 실시간으로 점들을 계산
if (this._objects && this._objects.length > 0) {
let allPoints = []
// 그룹에 groupPoints가 있으면 해당 점들을 사용 (도머의 경우)
if (this.groupPoints && Array.isArray(this.groupPoints)) {
const matrix = this.calcTransformMatrix()
console.log('this.groupPoints', this.groupPoints)
return this.groupPoints.map(function (p) {
const point = new fabric.Point(p.x, p.y)
return fabric.util.transformPoint(point, matrix)
// 그룹 내 모든 객체의 점들을 수집
this._objects.forEach(function (obj) {
if (obj.getCurrentPoints && typeof obj.getCurrentPoints === 'function') {
const objPoints = obj.getCurrentPoints()
allPoints = allPoints.concat(objPoints)
} else if (obj.points && Array.isArray(obj.points)) {
const pathOffset = obj.pathOffset || { x: 0, y: 0 }
const matrix = obj.calcTransformMatrix()
const transformedPoints = obj.points
.map(function (p) {
return new fabric.Point(p.x - pathOffset.x, p.y - pathOffset.y)
})
.map(function (p) {
return fabric.util.transformPoint(p, matrix)
})
allPoints = allPoints.concat(transformedPoints)
}
})
if (allPoints.length > 0) {
// Convex Hull 알고리즘을 사용하여 외곽 점들만 반환
return this.getConvexHull(allPoints)
}
}
// groupPoints가 없으면 바운딩 박스를 사용
// 객체가 없으면 바운딩 박스를 사용
const bounds = this.getBoundingRect()
const points = [
{ x: bounds.left, y: bounds.top },

View File

@ -766,15 +766,19 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
});
};
const sortedWallLines = sortCurrentRoofLines(wall.lines);
// const sortedWallLines = sortCurrentRoofLines(wall.lines);
// roofLines의 방향에 맞춰 currentRoofLines 조정 후 정렬
const alignedCurrentRoofLines = alignLineDirection(currentRoofLines, roofLines);
const sortedCurrentRoofLines = sortCurrentRoofLines(alignedCurrentRoofLines);
const sortedRoofLines = sortCurrentRoofLines(roofLines);
// const sortedRoofLines = sortCurrentRoofLines(roofLines);
const sortedWallBaseLines = sortCurrentRoofLines(wall.baseLines);
const sortedBaseLines = sortBaseLinesByWallLines(wall.baseLines, wallLines);
// const sortedBaseLines = sortBaseLinesByWallLines(wall.baseLines, wallLines);
const sortRoofLines = sortBaseLinesByWallLines(roofLines, wallLines);
// 원본 wallLines를 복사하여 사용
const sortedWallLines = [...wallLines];
const sortedBaseLines = sortBaseLinesByWallLines(wall.baseLines, sortedWallLines);
const sortedRoofLines = sortBaseLinesByWallLines(roofLines, sortedWallLines);
//wall.lines 는 기본 벽 라인
//wall.baseLine은 움직인라인
@ -802,7 +806,7 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
const currentRoofLine = currentRoofLines[index];
const moveLine = sortedBaseLines[index]
const wallBaseLine = sortedBaseLines[index]
console.log("wallBaseLine", wallBaseLine);
//console.log("wallBaseLine", wallBaseLine);
//roofline 외곽선 설정
@ -876,7 +880,7 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
return line
}
getAddLine(roofLine.startPoint, roofLine.endPoint, )
//getAddLine(roofLine.startPoint, roofLine.endPoint, ) //외곽선을 그린다
newPStart = { x: roofLine.x1, y: roofLine.y1 }
newPEnd = { x: roofLine.x2, y: roofLine.y2 }
@ -1228,6 +1232,7 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
getAddLine({ x: pLineX, y: newPointY }, { x: sPoint.x, y: sPoint.y }, 'pink')
}
//getAddLine({ x: roofLine.x2, y: roofLine.y2 }, { x: roofLine.x2, y: newPointY }, 'orange')
}
if(isStartEnd.end){
@ -1479,6 +1484,8 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
getAddLine(newPStart, newPEnd, 'red')
//canvas.remove(roofLine)
}else{
getAddLine(roofLine.startPoint, roofLine.endPoint, )
}
canvas.renderAll()
});