diff --git a/src/util/skeleton-utils.js b/src/util/skeleton-utils.js index 25e1b9c3..9c7248a5 100644 --- a/src/util/skeleton-utils.js +++ b/src/util/skeleton-utils.js @@ -623,30 +623,36 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => { canvas.renderAll() }) - function sortCurrentRoofLines(lines) { + function sortCurrentRoofLines(lines) { return [...lines].sort((a, b) => { - // 시작점과 끝점 중 더 작은 좌표를 기준으로 정렬 - const getMinPoint = (line) => { - const x1 = line.x1 ?? line.get('x1') - const y1 = line.y1 ?? line.get('y1') - const x2 = line.x2 ?? line.get('x2') - const y2 = line.y2 ?? line.get('y2') - - // x 좌표가 작은 점을 선택, 같으면 y 좌표가 작은 점 - if (x1 < x2 || (x1 === x2 && y1 < y2)) { - return { x: x1, y: y1 } + // Get all coordinates in a consistent order + const getCoords = (line) => { + const x1 = line.x1 ?? line.get('x1'); + const y1 = line.y1 ?? line.get('y1'); + const x2 = line.x2 ?? line.get('x2'); + const y2 = line.y2 ?? line.get('y2'); + + // Sort points left-to-right, then top-to-bottom + return x1 < x2 || (x1 === x2 && y1 < y2) + ? [x1, y1, x2, y2] + : [x2, y2, x1, y1]; + }; + + const aCoords = getCoords(a); + const bCoords = getCoords(b); + + // Compare each coordinate in order + for (let i = 0; i < 4; i++) { + if (Math.abs(aCoords[i] - bCoords[i]) > 0.1) { + return aCoords[i] - bCoords[i]; } - return { x: x2, y: y2 } } - - const aPoint = getMinPoint(a) - const bPoint = getMinPoint(b) - - if (aPoint.x !== bPoint.x) return aPoint.x - bPoint.x - return aPoint.y - bPoint.y - }) + return 0; + }); } + + // function sortCurrentRoofLines(lines) { // return [...lines].sort((a, b) => { // const aX = a.x1 ?? a.get('x1') @@ -689,8 +695,9 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => { return false } - const movedStart = Math.abs(moveLine.x1 - origin.x1) > EPSILON || Math.abs(moveLine.y1 - origin.y1) > EPSILON - const movedEnd = Math.abs(moveLine.x2 - origin.x2) > EPSILON || Math.abs(moveLine.y2 - origin.y2) > EPSILON + const movedStart = Math.abs(moveLine.x1 - wallLine.x1) > EPSILON || Math.abs(moveLine.y1 - origin.y1) > EPSILON + const movedEnd = Math.abs(moveLine.x2 - wallLine.x2) > EPSILON || Math.abs(moveLine.y2 - origin.y2) > EPSILON + const fullyMoved = movedStart && movedEnd @@ -722,23 +729,38 @@ let newPEnd //= {x:movedLines.x2, y:movedLines.y2} newPEnd.y = wallBaseLine.y2; } else if(wallBaseLine.y1 <= newPStart.y && newPStart.y <= wallBaseLine.y2 && wallBaseLine.y2 <= newPEnd.y){ newPStart.y = wallBaseLine.y1; + } else if(wallBaseLine.y2 <= newPEnd.y && newPStart.y <= wallBaseLine.y1 ) { // 위가운데 + newPEnd.y = wallBaseLine.y2; + newPStart.y = wallBaseLine.y1; + } else if(wallBaseLine.y1 <= newPStart.y && newPEnd.y <= wallBaseLine.y2 ) { // 아래가운데 + newPEnd.y = wallBaseLine.y1; + newPStart.y = wallBaseLine.y2; } }else if(getOrientation(roofLine) === 'horizontal') { - - if(newPEnd.x <= wallBaseLine.x2 && wallBaseLine.x2 <= newPStart.x && newPStart.x <= wallBaseLine.x1){ + + if(newPEnd.x <= wallBaseLine.x2 && wallBaseLine.x2 <= newPStart.x && newPStart.x <= wallBaseLine.x1){ //위 왼쪽 newPStart.x = wallBaseLine.x1; - } else if(wallBaseLine.x2 <= newPEnd.x && newPEnd.x <= wallBaseLine.x1 && wallBaseLine.x1 <= newPStart.x){ + } else if(wallBaseLine.x2 <= newPEnd.x && newPEnd.x <= wallBaseLine.x1 && wallBaseLine.x1 <= newPStart.x){ //아래오르쪽 newPEnd.x = wallBaseLine.x2; - } else if(newPStart.x <= wallBaseLine.x1 && wallBaseLine.x1 <= newPEnd.x && newPEnd.x <= wallBaseLine.x2){ + } else if(newPStart.x <= wallBaseLine.x1 && wallBaseLine.x1 <= newPEnd.x && newPEnd.x <= wallBaseLine.x2){ //위 오른쪽 newPEnd.x = wallBaseLine.x2; - } else if(wallBaseLine.x1 <= newPStart.x && newPStart.x <= wallBaseLine.x2 && wallBaseLine.x2 <= newPEnd.x){ + } else if(wallBaseLine.x1 <= newPStart.x && newPStart.x <= wallBaseLine.x2 && wallBaseLine.x2 <= newPEnd.x){ //아래 왼쪽 newPStart.x = wallBaseLine.x1; + } else if(wallBaseLine.x2 <= newPEnd.x && newPStart.x <= wallBaseLine.x1 ) { // 위가운데 + newPEnd.x = wallBaseLine.x2; + newPStart.x = wallBaseLine.x1; + } else if(wallBaseLine.x1 <= newPStart.x && newPEnd.x <= wallBaseLine.x2 ) { // 아래가운데 + newPEnd.x = wallBaseLine.x1; + newPStart.x = wallBaseLine.x2; } - - + + + + + } movedLines.push({ index, newPStart, newPEnd }) @@ -850,9 +872,9 @@ console.log("innerLines:::::", innerLines) console.log("movedLines", movedLines) // --- 사용 예시 --- -const polygons = findConnectedLines(movedLines, innerLines, canvas, roofId, roof); -console.log("polygon", polygons); -canvas.renderAll +// const polygons = findConnectedLines(movedLines, innerLines, canvas, roofId, roof); +// console.log("polygon", polygons); +// canvas.renderAll return innerLines; } /*