sk line angle2

This commit is contained in:
ysCha 2025-11-21 19:29:26 +09:00
parent 3967581b99
commit 25a84cc735

View File

@ -533,6 +533,16 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
);
//그림을 그릴때 idx 가 필요함 roof는 왼쪽부터 시작됨 - 그림그리는 순서가 필요함
let roofIdx = 0;
// roofLines.forEach((roofLine) => {
//
// if (isSameLine(p1.x, p1.y, p2.x, p2.y, roofLine) || isSameLine(p2.x, p2.y, p1.x, p1.y, roofLine)) {
// roofIdx = roofLine.idx;
// console.log("roofIdx::::::", roofIdx)
// return false; // forEach 중단
// }
// });
const skeletonLine = new QLine([p1.x, p1.y, p2.x, p2.y], {
parentId: roof.id,
@ -545,7 +555,8 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
isBaseLine: sktLine.attributes.isOuterEdge,
lineName: (sktLine.attributes.isOuterEdge)?'roofLine': attributes.type,
selectable:(!sktLine.attributes.isOuterEdge),
visible: (!sktLine.attributes.isOuterEdge),
lineNo: (sktLine.attributes.isOuterEdge)? skIndex:0,//그려지는 외곽라인의 순서를 찾아서...
});
@ -557,6 +568,14 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
//skeleton 라인에서 처마선은 삭제
if(skeletonLine.lineName === 'roofLine'){
skeletonLine.set('visible', true); //임시
roof.set({
stroke: 'black',
strokeWidth: 10
});
const coordinateText = new fabric.Text(`(${Math.round(skeletonLine.x1)}, ${Math.round(skeletonLine.y1)})`, {
left: skeletonLine.x1 + 5, // 좌표점에서 약간 오른쪽으로 이동
top: skeletonLine.y1 - 20, // 좌표점에서 약간 위로 이동
@ -573,6 +592,8 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
})
canvas?.add(coordinateText)
}else{
@ -586,7 +607,7 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
// 같은 라인이 없으므로 새 다각형 라인 생성
//라인 편집
// let i = 0
//const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine' && obj.attributes.roofId === roofId)
const currentRoofLines = canvas.getObjects().filter((obj) => obj.lineName === 'roofLine' && obj.attributes.roofId === roofId)
let roofLineRects = canvas.getObjects().filter((obj) => obj.name === 'roofLineRect' && obj.roofId === roofId)
@ -596,13 +617,36 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
})
function sortLinesByStartPoint(lines) {
return [...lines].sort((a, b) => {
// 시작점의 x 좌표로 먼저 정렬
if (a.startPoint.x !== b.startPoint.x) {
return a.startPoint.x - b.startPoint.x;
}
// x 좌표가 같으면 y 좌표로 정렬
return a.startPoint.y - b.startPoint.y;
});
}
// 각 라인 집합 정렬
const sortedWallLines = sortLinesByStartPoint(wall.lines);
const sortedCurrentRoofLines = sortLinesByStartPoint(currentRoofLines);
const sortedRoofLines = sortLinesByStartPoint(roofLines);
//wall.lines 는 기본 벽 라인
//wall.baseLine은 움직인라인
const movedLines = []
wall.lines.forEach((wallLine, index) => {
sortedWallLines.forEach((wallLine, index) => {
console.log("wallLine:::::", wallLine, index)
let p1,p2,p3, p4
const roofLine = sortedRoofLines[index];
const currentRoofLine = sortedCurrentRoofLines[index+1];
let p1,p2,p3, p4
let idx = 0;
let isMoveLine = false;
@ -615,7 +659,31 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
const wallLineEndPoint = {x:wallLine.x2, y:wallLine.y2}
const moveLine = wall.baseLines[index] //이동한 wall 존재여부 (초기 wall line = base line)
if(index === 2){
let testLine = new QLine([roofLine.x1, roofLine.y1, roofLine.x2, roofLine.y2], {
stroke: 'yellow',
strokeWidth: 10,
property: 'normal',
fontSize: 14,
});
let testLine2 = new QLine([currentRoofLine.x1, currentRoofLine.y1, currentRoofLine.x2, currentRoofLine.y2], {
stroke: 'red',
strokeWidth: 10,
property: 'normal',
fontSize: 14,
});
let testLine3 = new QLine([wallLine.x1, wallLine.y1, wallLine.x2, wallLine.y2], {
stroke: 'blue',
strokeWidth: 10,
property: 'normal',
fontSize: 14,
});
canvas.add(testLine)
canvas.add(testLine2)
canvas.add(testLine3)
canvas.renderAll()
}
// // 사용자가 라인을 드래그하기 시작할 때
// baseLine.on('moving', () => {
@ -641,14 +709,17 @@ const createInnerLinesFromSkeleton = (roofId, canvas, skeleton, textMode) => {
if (moved) {
let testLine = new QLine([moveLine.x1, moveLine.y1, moveLine.x2, moveLine.y2], {
stroke: 'yellow',
strokeWidth: 10,
property: 'normal',
fontSize: 14,
});
canvas.add(testLine)
canvas.renderAll()
const p1moveLine = findClosestRoofLine(moveLine.startPoint, currentRoofLines)
const p2moveLine = findClosestRoofLine(moveLine.endPoint, currentRoofLines)
const p1RoofLine = findClosestRoofLine(currentRoofLine.startPoint,roof.lines)
const p2RoofLine = findClosestRoofLine(currentRoofLine.endPoint,roof.lines)
const p1wallLine = findClosestRoofLine(wallLineStartPoint,wall.lines)
const p2wallLine = findClosestRoofLine(wallLineEndPoint,wall.lines)
const getPolygonOrientation = baseLines => {
if (!baseLines?.length) return 0
@ -795,8 +866,7 @@ if (moved) {
const p1wallLine = findClosestRoofLine(wallLineStartPoint,wall.lines)
const p2wallLine = findClosestRoofLine(wallLineEndPoint,wall.lines)
//move 접점
const p1moveLine = findClosestRoofLine(moveLine.startPoint, wall.l)
const p2moveLine = findClosestRoofLine(moveLine.endPoint, currentRoofLines)
//wall move 접점
const p1outerLine = findClosestRoofLine(wallLineStartPoint, currentRoofLines)
const p2outerLine = findClosestRoofLine(wallLineEndPoint, currentRoofLines)
@ -1263,11 +1333,7 @@ if (moved) {
// canvas.renderAll()
// });
// let baseLines = canvas.getObjects().filter((obj) => obj.name === 'baseLine' && obj.parentId === roofId)
// baseLines.forEach((baseLine) => {
// canvas.remove(baseLine)
// canvas.renderAll()
// });
}
});