sk line angle2
This commit is contained in:
parent
3967581b99
commit
25a84cc735
@ -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()
|
||||
// });
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user