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

외벽선등 색깔 정리

Browse Source
This commit is contained in:
Jaeyoung Lee 2024-11-26 13:16:25 +09:00
parent 7bc2d9acd6
commit 3cbc99552a
2 changed files with 112 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/hooks/useMode.js
View File

@ -1265,7 +1265,6 @@ export function useMode() {
const wall = makePolygon(null, sort)
wall.name = 'wall'
// wall.set({ name: 'wall' })
return wall
}
@ -1363,7 +1362,8 @@ export function useMode() {
const polygon = new QPolygon(
points,
{
stroke: 'black',
stroke: '#1083E3',
strokeWidth: 2,
fill: 'transparent',
viewLengthText: true,
fontSize: fontSize,
@ -1515,7 +1515,24 @@ export function useMode() {
pitch: 4,
sleeve: true,
}*/
if (index % 2 === 0) {
/*if (index % 2 === 0) {
line.attributes = {
type: LINE_TYPE.WALLLINE.GABLE,
offset: 30,
width: 50,
pitch: 4,
sleeve: true,
}
} else {
line.attributes = {
type: LINE_TYPE.WALLLINE.EAVES,
offset: 50,
width: 50,
pitch: 4,
sleeve: true,
}
}*/
if (index === polygon.lines.length - 1) {
line.attributes = {
type: LINE_TYPE.WALLLINE.GABLE,
offset: 30,
@ -1748,6 +1765,10 @@ export function useMode() {
roofId: roof.id,
}
canvas
.getObjects()
.filter((line) => line.attributes?.wallId === wall.id)
.forEach((line) => canvas.remove(line))
wall.lines.forEach((line, index) => {
const lineLength = Math.sqrt(
Math.pow(Math.round(Math.abs(line.x1 - line.x2) * 10), 2) + Math.pow(Math.round(Math.abs(line.y1 - line.y2) * 10), 2),
@ -1756,11 +1777,45 @@ export function useMode() {
line.attributes.currentRoof = roof.lines[index].id
line.attributes.planeSize = lineLength
line.attributes.actualSize = lineLength
let wallStroke, wallStrokeWidth
switch (line.attributes.type) {
case LINE_TYPE.WALLLINE.EAVES:
wallStroke = '#45CD7D'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.HIPANDGABLE:
wallStroke = '#45CD7D'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.GABLE:
wallStroke = '#3FBAE6'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.JERKINHEAD:
wallStroke = '#3FBAE6'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.SHED:
wallStroke = '#000000'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.WALL:
wallStroke = '#000000'
wallStrokeWidth = 4
break
}
const wallLine = new fabric.Line([line.x1, line.y1, line.x2, line.y2], {
attributes: { wallId: wall.id },
stroke: wallStroke,
strokeWidth: wallStrokeWidth,
selectable: false,
})
canvas.add(wallLine)
})
setRoof(roof)
setWall(wall)
return roof
}

110
src/util/qpolygon-utils.js
View File

@ -1786,7 +1786,7 @@ const drawRidge = (roof, canvas) => {
const checkLine = new QLine([startXPoint, startYPoint, checkEndXPoint, checkEndYPoint], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: { roofId: roof.id, currentRoof: currentRoof.id, actualSize: 0 },
})
@ -1838,8 +1838,8 @@ const drawRidge = (roof, canvas) => {
const ridge = new QLine([startXPoint, startYPoint, endXPoint, endYPoint], {
fontSize: roof.fontSize,
stroke: 'blue',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.RIDGE,
attributes: { roofId: roof.id },
})
@ -1877,8 +1877,8 @@ const drawRidge = (roof, canvas) => {
let y2 = Math.max(ridge.y1, ridge2.y1, ridge.y2, ridge2.y2)
const newRidge = new QLine([x1, y1, x2, y2], {
fontSize: roof.fontSize,
stroke: 'blue',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.RIDGE,
attributes: { roofId: roof.id },
})
@ -1964,12 +1964,11 @@ const drawHips = (roof, canvas) => {
const vectorX1 = ridgeCoordinate.x1 - currentRoof.x1
const vectorY1 = ridgeCoordinate.y1 - currentRoof.y1
const angle1 = Math.atan2(vectorY1, vectorX1) * (180 / Math.PI)
console.log('angle1', Math.abs(Math.round(angle1)) % 45)
if (Math.abs(Math.round(angle1)) % 45 === 0) {
const hip1 = new QLine([currentRoof.x1, currentRoof.y1, ridgeCoordinate.x1, ridgeCoordinate.y1], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: { roofId: roof.id, currentRoof: currentRoof.id, actualSize: 0 },
})
@ -1991,8 +1990,8 @@ const drawHips = (roof, canvas) => {
if (Math.abs(Math.round(angle2)) % 45 === 0) {
const hip2 = new QLine([currentRoof.x2, currentRoof.y2, ridgeCoordinate.x1, ridgeCoordinate.y1], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: { roofId: roof.id, currentRoof: currentRoof.id, actualSize: 0 },
})
@ -2063,8 +2062,8 @@ const drawHips = (roof, canvas) => {
if (ridgePoints !== undefined) {
const hip = new QLine([currentRoof.x1, currentRoof.y1, ridgePoints.x, ridgePoints.y], {
fontSize: roof.fontSize,
stroke: 'yellow',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: { roofId: roof.id, currentRoof: currentRoof.id, actualSize: 0 },
})
@ -2211,8 +2210,8 @@ const connectLinePoint = (polygon) => {
const line = new QLine([p.x1, p.y1, p.x2, p.y2], {
attributes: { roofId: polygon.id },
fontSize: polygon.fontSize,
stroke: 'purple',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
})
line.attributes.planeSize = Math.round(Math.sqrt(Math.pow(line.x1 - line.x2, 2) + Math.pow(line.y1 - line.y2, 2)) * 10) / 10
line.attributes.actualSize = Math.round(Math.sqrt(Math.pow(line.x1 - line.x2, 2) + Math.pow(line.y1 - line.y2, 2)) * 10) / 10
@ -2269,8 +2268,8 @@ const connectLinePoint = (polygon) => {
const line = new QLine([p.x1, p.y1, p.x2, p.y2], {
attributes: { roofId: polygon.id },
fontSize: polygon.fontSize,
stroke: 'purple',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
})
line.attributes.planeSize = Math.round(Math.sqrt(Math.pow(line.x1 - line.x2, 2) + Math.pow(line.y1 - line.y2, 2)) * 10)
line.attributes.actualSize = Math.round(Math.sqrt(Math.pow(line.x1 - line.x2, 2) + Math.pow(line.y1 - line.y2, 2)) * 10)
@ -2323,8 +2322,8 @@ const connectLinePoint = (polygon) => {
let y2 = Math.max(ridge.y1, ridge2.y1, ridge.y2, ridge2.y2)
const newRidge = new QLine([x1, y1, x2, y2], {
fontSize: polygon.fontSize,
stroke: 'blue',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.RIDGE,
attributes: { roofId: polygon.id },
})
@ -2554,8 +2553,6 @@ const changeEavesRoof = (currentRoof, canvas) => {
if (ridgeLines.length > 0) {
const ridge = ridgeLines[0]
console.log(currentRoof.attributes.ridgeCoordinate)
console.log('ridge.x1 : ', ridge.x1, 'ridge.y1 : ', ridge.y1, 'ridge.x2 : ', ridge.x2, 'ridge.y2 : ', ridge.y2)
if (ridge.x1 === currentRoof.attributes.ridgeCoordinate.x1 && ridge.y1 === currentRoof.attributes.ridgeCoordinate.y1) {
ridge.set({
x1: hipX2,
@ -2574,7 +2571,6 @@ const changeEavesRoof = (currentRoof, canvas) => {
})
currentRoof.attributes.ridgeCoordinate = { x1: ridge.x2, y1: ridge.y2 }
}
console.log('ridge.x1 : ', ridge.x1, 'ridge.y1 : ', ridge.y1, 'ridge.x2 : ', ridge.x2, 'ridge.y2 : ', ridge.y2)
ridge.attributes.planeSize = Math.round(Math.sqrt(Math.pow(ridge.x1 - ridge.x2, 2) + Math.pow(ridge.y1 - ridge.y2, 2)) * 10)
ridge.attributes.actualSize = Math.round(Math.sqrt(Math.pow(ridge.x1 - ridge.x2, 2) + Math.pow(ridge.y1 - ridge.y2, 2)) * 10)
}
@ -2592,8 +2588,8 @@ const changeEavesRoof = (currentRoof, canvas) => {
const hip1 = new QLine([currentRoof.x1, currentRoof.y1, hipX2, hipY2], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roof.id,
@ -2611,8 +2607,8 @@ const changeEavesRoof = (currentRoof, canvas) => {
const hip2 = new QLine([currentRoof.x2, currentRoof.y2, hipX2, hipY2], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roof.id,
@ -2761,8 +2757,8 @@ const changeGableRoof = (currentRoof, canvas) => {
let hip1 = new QLine([currentRoof.x1, currentRoof.y1, midX, midY], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roofId,
@ -2778,8 +2774,8 @@ const changeGableRoof = (currentRoof, canvas) => {
let hip2 = new QLine([currentRoof.x2, currentRoof.y2, midX, midY], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roofId,
@ -2950,8 +2946,8 @@ const changeHipAndGableRoof = (currentRoof, canvas) => {
const hip1 = new QLine([currentRoof.x1, currentRoof.y1, midX + hipX2, midY + hipY2], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roof.id,
@ -2970,8 +2966,8 @@ const changeHipAndGableRoof = (currentRoof, canvas) => {
const hip2 = new QLine([currentRoof.x2, currentRoof.y2, midX + hipX2, midY + hipY2], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roof.id,
@ -3005,8 +3001,8 @@ const changeHipAndGableRoof = (currentRoof, canvas) => {
hipLines.forEach((hip, i) => {
const gableLine = new QLine([hip.x2, hip.y2, currentRoof.attributes.ridgeCoordinate.x1, currentRoof.attributes.ridgeCoordinate.y1], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.GABLE,
attributes: {
roofId: roof.id,
@ -3191,8 +3187,8 @@ const changeJerkInHeadRoof = (currentRoof, canvas) => {
const gable1 = new QLine([midX + hipX1, midY + hipY1, hipX2, hipY2], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.GABLE,
attributes: {
roofId: roof.id,
@ -3213,8 +3209,8 @@ const changeJerkInHeadRoof = (currentRoof, canvas) => {
const gable2 = new QLine([midX + hipX1, midY + hipY1, hipX2, hipY2], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.GABLE,
attributes: {
roofId: roof.id,
@ -3231,8 +3227,8 @@ const changeJerkInHeadRoof = (currentRoof, canvas) => {
const gable3 = new QLine([gable1.x1, gable1.y1, gable2.x1, gable2.y1], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.GABLE,
attributes: {
roofId: roof.id,
@ -3247,8 +3243,8 @@ const changeJerkInHeadRoof = (currentRoof, canvas) => {
const hip1 = new QLine([currentRoof.x1, currentRoof.y1, gable1.x1, gable1.y1], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.GABLE,
attributes: {
roofId: roof.id,
@ -3265,8 +3261,8 @@ const changeJerkInHeadRoof = (currentRoof, canvas) => {
const hip2 = new QLine([currentRoof.x2, currentRoof.y2, gable2.x1, gable2.y1], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roof.id,
@ -3421,8 +3417,8 @@ const changeWallRoof = (currentRoof, canvas) => {
const addPrevWallLine1 = new QLine([prevX2, prevY2, wallLine.x1 - prevWidthX, wallLine.y1 - prevWidthY], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: 'roofLine',
attributes: { roofId: roofId, type: LINE_TYPE.WALLLINE.ETC },
})
@ -3431,8 +3427,8 @@ const changeWallRoof = (currentRoof, canvas) => {
[addPrevWallLine1.x2, addPrevWallLine1.y2, addPrevWallLine1.x2 + prevWidthX, addPrevWallLine1.y2 + prevWidthY],
{
fontSize: roof.fontSize,
stroke: 'cyan',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: 'roofLine',
attributes: { roofId: roofId, type: LINE_TYPE.WALLLINE.ETC },
},
@ -3440,16 +3436,16 @@ const changeWallRoof = (currentRoof, canvas) => {
const addNextWallLine1 = new QLine([wallLine.x2, wallLine.y2, wallLine.x2 + nextWidthX, wallLine.y2 + nextWidthY], {
fontSize: roof.fontSize,
stroke: 'green',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: 'roofLine',
attributes: { roofId: roofId, type: LINE_TYPE.WALLLINE.ETC },
})
const addNextWallLine2 = new QLine([addNextWallLine1.x2, addNextWallLine1.y2, nextX1, nextY1], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: 'roofLine',
attributes: { roofId: roofId, type: LINE_TYPE.WALLLINE.ETC },
})
@ -3493,8 +3489,8 @@ const changeWallRoof = (currentRoof, canvas) => {
let hip1 = new QLine([currentRoof.x1, currentRoof.y1, wallMidX, wallMidY], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roof.id,
@ -3509,8 +3505,8 @@ const changeWallRoof = (currentRoof, canvas) => {
let hip2 = new QLine([currentRoof.x2, currentRoof.y2, wallMidX, wallMidY], {
fontSize: roof.fontSize,
stroke: 'red',
strokeWidth: 1,
stroke: '#1083E3',
strokeWidth: 2,
name: LINE_TYPE.SUBLINE.HIP,
attributes: {
roofId: roof.id,