qcast3/qcast-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

배치면 도형 재배치 및 처마,용마루,케라바 타입 변경 로직 변경

Browse Source
This commit is contained in:
yjnoh 2025-03-25 14:49:07 +09:00
parent 5e27ab282c
commit 592275c0de
3 changed files with 47 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/common/common.js
View File

@ -203,6 +203,7 @@ export const SAVE_KEY = [
'fontWeight', 'fontWeight',
'dormerAttributes', 'dormerAttributes',
'toFixed', 'toFixed',
'isSortedPoints',
] ]
export const OBJECT_PROTOTYPE = [fabric.Line.prototype, fabric.Polygon.prototype, fabric.Triangle.prototype, fabric.Group.prototype] export const OBJECT_PROTOTYPE = [fabric.Line.prototype, fabric.Polygon.prototype, fabric.Triangle.prototype, fabric.Group.prototype]

4
src/components/fabric/QPolygon.js
View File

@ -45,8 +45,11 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
options.sort = options.sort ?? true options.sort = options.sort ?? true
options.parentId = options.parentId ?? null options.parentId = options.parentId ?? null
this.isSortedPoints = false
if (!options.sort && points.length <= 8) { if (!options.sort && points.length <= 8) {
points = sortedPointLessEightPoint(points) points = sortedPointLessEightPoint(points)
this.isSortedPoints = true
} else { } else {
let isDiagonal = false let isDiagonal = false
points.forEach((point, i) => { points.forEach((point, i) => {
@ -62,6 +65,7 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
if (!isDiagonal) { if (!isDiagonal) {
points = sortedPoints(points) points = sortedPoints(points)
this.isSortedPoints = true
} }
} }

114
src/hooks/surface/useSurfaceShapeBatch.js
View File

@ -199,6 +199,8 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
pitch: globalPitch, pitch: globalPitch,
surfaceId: surfaceId, surfaceId: surfaceId,
direction: direction, direction: direction,
isXInversion: xInversion,
isYInversion: yInversion,
}) })
canvas.setActiveObject(batchSurface) canvas.setActiveObject(batchSurface)
setSurfaceShapePattern(batchSurface, roofDisplay.column) setSurfaceShapePattern(batchSurface, roofDisplay.column)
@ -213,35 +215,6 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
// console.log('xInversion', xInversion) //상하반전 // console.log('xInversion', xInversion) //상하반전
// console.log('yInversion', yInversion) //좌우반전 // console.log('yInversion', yInversion) //좌우반전
//좌우 반전일때 방향 변경
if (yInversion) {
batchSurface.lines.forEach((line) => {
const { x1, y1, x2, y2 } = line
if (line.x1 > line.x2) {
if (line.direction === 'left') {
line.direction = 'right'
line.x1 = x2
line.x2 = x1
} else if (line.direction === 'right') {
line.direction = 'left'
line.x1 = x2
line.x2 = x1
}
}
if (line.y2 > line.y1) {
if (line.direction === 'bottom') {
line.direction = 'top'
line.y1 = y2
line.y2 = y1
} else if (line.direction === 'top') {
line.direction = 'bottom'
line.y1 = y2
line.y2 = y1
}
}
})
}
changeSurfaceLineType(batchSurface) changeSurfaceLineType(batchSurface)
if (setIsHidden) setIsHidden(false) if (setIsHidden) setIsHidden(false)
@ -650,27 +623,27 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
} }
case 14: { case 14: {
points = [ points = [
{ x: pointer.x - length1 / 2 + length2, y: pointer.y + length4 / 2 },
{ x: pointer.x - length1 / 2, y: pointer.y + length4 / 2 },
{ x: pointer.x - length1 / 2, y: pointer.y + length4 / 2 - length4 }, { x: pointer.x - length1 / 2, y: pointer.y + length4 / 2 - length4 },
{ x: pointer.x - length1 / 2 + length1, y: pointer.y + length4 / 2 - length4 }, { x: pointer.x - length1 / 2, y: pointer.y + length4 / 2 },
{ x: pointer.x - length1 / 2 + length1, y: pointer.y + length4 / 2 - length4 + length4 }, { x: pointer.x - length1 / 2 + length2, y: pointer.y + length4 / 2 },
{ x: pointer.x - length1 / 2 + length1 - length3, y: pointer.y + length4 / 2 - length4 + length4 },
{ {
x: pointer.x - length1 / 2 + length2 + (length1 - length2 - length3) / 2, x: pointer.x - length1 / 2 + length2 + (length1 - length2 - length3) / 2,
y: pointer.y + length4 / 2 - length4 + length5, y: pointer.y + length4 / 2 - length4 + length5,
}, },
{ x: pointer.x - length1 / 2 + length1 - length3, y: pointer.y + length4 / 2 - length4 + length4 },
{ x: pointer.x - length1 / 2 + length1, y: pointer.y + length4 / 2 - length4 + length4 },
{ x: pointer.x - length1 / 2 + length1, y: pointer.y + length4 / 2 - length4 },
] ]
break break
} }
case 15: { case 15: {
points = [ points = [
{ x: pointer.x - length1 / 2, y: pointer.y + length2 - length2 / 2 },
{ x: pointer.x - length1 / 2, y: pointer.y + length2 - length2 / 2 - length3 }, { x: pointer.x - length1 / 2, y: pointer.y + length2 - length2 / 2 - length3 },
{ x: pointer.x, y: pointer.y + length2 - length2 / 2 - length3 - (length2 - length3) }, { x: pointer.x - length1 / 2, y: pointer.y + length2 - length2 / 2 },
{ x: pointer.x + length1 / 2, y: pointer.y + length2 - length2 / 2 - length3 },
{ x: pointer.x + length1 / 2, y: pointer.y + length2 - length2 / 2 - length3 + length3 }, { x: pointer.x + length1 / 2, y: pointer.y + length2 - length2 / 2 - length3 + length3 },
{ x: pointer.x + length1 / 2, y: pointer.y + length2 - length2 / 2 - length3 },
{ x: pointer.x, y: pointer.y + length2 - length2 / 2 - length3 - (length2 - length3) },
] ]
break break
} }
@ -678,28 +651,28 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
case 16: { case 16: {
points = [ points = [
{ {
x: pointer.x - length1 / 2, x: pointer.x - length1 / 2 + (length1 - length2) / 2,
y: pointer.y + length3 / 2, y: pointer.y + length3 / 2 - (length3 - length4) - length4,
}, },
{ {
x: pointer.x - length1 / 2 + (length1 - length2) / 2, x: pointer.x - length1 / 2 + (length1 - length2) / 2,
y: pointer.y + length3 / 2 - (length3 - length4), y: pointer.y + length3 / 2 - (length3 - length4),
}, },
{ {
x: pointer.x - length1 / 2 + (length1 - length2) / 2, x: pointer.x - length1 / 2,
y: pointer.y + length3 / 2 - (length3 - length4) - length4, y: pointer.y + length3 / 2,
}, },
{ {
x: pointer.x - length1 / 2 + (length1 - length2) / 2 + length2, x: pointer.x - length1 / 2 + length1,
y: pointer.y + length3 / 2 - (length3 - length4) - length4, y: pointer.y + length3 / 2,
}, },
{ {
x: pointer.x - length1 / 2 + (length1 - length2) / 2 + length2, x: pointer.x - length1 / 2 + (length1 - length2) / 2 + length2,
y: pointer.y + length3 / 2 - (length3 - length4) - length4 + length4, y: pointer.y + length3 / 2 - (length3 - length4) - length4 + length4,
}, },
{ {
x: pointer.x - length1 / 2 + length1, x: pointer.x - length1 / 2 + (length1 - length2) / 2 + length2,
y: pointer.y + length3 / 2, y: pointer.y + length3 / 2 - (length3 - length4) - length4,
}, },
] ]
break break
@ -710,25 +683,25 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
const topL = (length1 - length2) / 2 / Math.cos((angle * Math.PI) / 180) // 꺽이는부분 윗쪽 길이 const topL = (length1 - length2) / 2 / Math.cos((angle * Math.PI) / 180) // 꺽이는부분 윗쪽 길이
points = [ points = [
{
x: pointer.x - length1 / 2 + length1,
y: pointer.y + length3 / 2,
},
{ {
x: pointer.x - length1 / 2, x: pointer.x - length1 / 2,
y: pointer.y + length3 / 2, y: pointer.y + length3 / 2,
}, },
{ {
x: pointer.x - length1 / 2 + length4 * Math.cos(degreesToRadians(angle)), x: pointer.x - length1 / 2 + length1,
y: pointer.y + length3 / 2 - length4 * Math.sin(degreesToRadians(angle)), y: pointer.y + length3 / 2,
},
{
x: pointer.x - length1 / 2 + length4 * Math.cos(degreesToRadians(angle)) + length2 + topL * Math.cos(degreesToRadians(angle)),
y: pointer.y + length3 / 2 - length4 * Math.sin(degreesToRadians(angle)) + topL * Math.sin(degreesToRadians(angle)),
}, },
{ {
x: pointer.x - length1 / 2 + length4 * Math.cos(degreesToRadians(angle)) + length2, x: pointer.x - length1 / 2 + length4 * Math.cos(degreesToRadians(angle)) + length2,
y: pointer.y + length3 / 2 - length4 * Math.sin(degreesToRadians(angle)), y: pointer.y + length3 / 2 - length4 * Math.sin(degreesToRadians(angle)),
}, },
{ {
x: pointer.x - length1 / 2 + length4 * Math.cos(degreesToRadians(angle)) + length2 + topL * Math.cos(degreesToRadians(angle)), x: pointer.x - length1 / 2 + length4 * Math.cos(degreesToRadians(angle)),
y: pointer.y + length3 / 2 - length4 * Math.sin(degreesToRadians(angle)) + topL * Math.sin(degreesToRadians(angle)), y: pointer.y + length3 / 2 - length4 * Math.sin(degreesToRadians(angle)),
}, },
] ]
break break
@ -1111,7 +1084,10 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
* @param { } polygon * @param { } polygon
*/ */
//폴리곤, 상하반전, 좌우반전
const changeSurfaceLineType = (polygon) => { const changeSurfaceLineType = (polygon) => {
const { isXInversion, isYInversion } = polygon //상하반전, 좌우반전
polygon.lines.forEach((line) => { polygon.lines.forEach((line) => {
line.attributes.type = LINE_TYPE.WALLLINE.GABLE line.attributes.type = LINE_TYPE.WALLLINE.GABLE
}) })
@ -1129,10 +1105,8 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
if (line[coord1] === line[coord2]) { if (line[coord1] === line[coord2]) {
if (line.direction === evaesDirection) { if (line.direction === evaesDirection) {
line.attributes.type = LINE_TYPE.WALLLINE.EAVES line.attributes.type = LINE_TYPE.WALLLINE.EAVES
line.stroke = 'rgb(1, 1, 1)'
} else if (line.direction === ridgeDirection) { } else if (line.direction === ridgeDirection) {
line.attributes.type = LINE_TYPE.SUBLINE.RIDGE line.attributes.type = LINE_TYPE.SUBLINE.RIDGE
line.stroke = 'rgb(9, 9, 9)'
} }
} }
}) })
@ -1152,21 +1126,19 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
: a : a
}) })
// if ( //정렬된 폴리곤이 아니면(대각선이 존재하는 폴리곤일때)
// (polygon.direction === 'south' && maxLineSorted.direction === 'left') || if (!polygon.isSortedPoints) {
// (polygon.direction === 'north' && maxLineSorted.direction === 'right') //좌우 반전을 했으면 반대로 정의함
// // || if (isYInversion) {
// // (polygon.direction === 'east' && maxLineSorted.direction === 'bottom') || polygon.lines.forEach((line) => {
// // (polygon.direction === 'west' && maxLineSorted.direction === 'top') if (line.attributes.type === LINE_TYPE.WALLLINE.EAVES) {
// ) { line.attributes.type = LINE_TYPE.SUBLINE.RIDGE
// polygon.lines.forEach((line) => { } else if (line.attributes.type === LINE_TYPE.SUBLINE.RIDGE) {
// if (line.attributes.type === LINE_TYPE.WALLLINE.EAVES) { line.attributes.type = LINE_TYPE.WALLLINE.EAVES
// line.attributes.type = LINE_TYPE.SUBLINE.RIDGE }
// } else if (line.attributes.type === LINE_TYPE.SUBLINE.RIDGE) { })
// line.attributes.type = LINE_TYPE.WALLLINE.EAVES }
// } }
// })
// }
if (maxLine.length === 1) { if (maxLine.length === 1) {
const maxLineCoord = polygon.lines.reduce((a, b) => { const maxLineCoord = polygon.lines.reduce((a, b) => {
@ -1186,7 +1158,6 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
if (targetCoord !== realLineCoord) { if (targetCoord !== realLineCoord) {
line.attributes.type = LINE_TYPE.SUBLINE.RIDGE line.attributes.type = LINE_TYPE.SUBLINE.RIDGE
line.stroke = 'rgb(9, 9, 9)'
} }
} else if (polygon.direction === 'east' || polygon.direction === 'west') { } else if (polygon.direction === 'east' || polygon.direction === 'west') {
const targetCoord = const targetCoord =
@ -1195,7 +1166,6 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
if (targetCoord !== realLineCoord) { if (targetCoord !== realLineCoord) {
line.attributes.type = LINE_TYPE.SUBLINE.RIDGE line.attributes.type = LINE_TYPE.SUBLINE.RIDGE
line.stroke = 'rgb(9, 9, 9)'
} }
} }
}) })