지붕 그리기 수정
This commit is contained in:
Jaeyoung Lee
parent
d7bdfa4892
commit
29fac01284
@ -469,7 +469,7 @@ export default function Roof2(props) {
|
||||
{ x: 500, y: 100 },
|
||||
]
|
||||
|
||||
const polygon = new QPolygon(eightPoint4, {
|
||||
const polygon = new QPolygon(test4, {
|
||||
fill: 'transparent',
|
||||
stroke: 'green',
|
||||
strokeWidth: 1,
|
||||
|
||||
@ -31,6 +31,7 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
|
||||
this.cells = []
|
||||
this.innerLines = []
|
||||
this.children = []
|
||||
this.separatePolygon = []
|
||||
|
||||
// 소수점 전부 제거
|
||||
points.forEach((point) => {
|
||||
|
||||
@ -1515,7 +1515,7 @@ export function useMode() {
|
||||
pitch: 4,
|
||||
sleeve: true,
|
||||
}*/
|
||||
if (index % 2 !== 0) {
|
||||
if (index % 2 === 0) {
|
||||
line.attributes = {
|
||||
type: LINE_TYPE.WALLLINE.GABLE,
|
||||
offset: 30,
|
||||
|
||||
@ -1253,20 +1253,10 @@ export const drawGabledRoof = (roofId, canvas) => {
|
||||
const minY = Math.min(...roofPoints.map((point) => point.y))
|
||||
const maxY = Math.max(...roofPoints.map((point) => point.y))
|
||||
|
||||
// 맞은편 라인을 찾기 위해 현재 polygon으로 만들수 있는 최대한의 길이를 구한다.
|
||||
const checkLength = Math.abs(Math.sqrt(Math.pow(maxX - minX, 2) + Math.pow(maxY - minY, 2)))
|
||||
|
||||
wallLines
|
||||
.filter((line) => line.attributes !== undefined && line.attributes.type === LINE_TYPE.WALLLINE.GABLE)
|
||||
.forEach((gable) => {
|
||||
const gableLine = new QLine([gable.x1, gable.y1, gable.x2, gable.y2], {
|
||||
fontSize: roof.fontSize,
|
||||
stroke: 'cyan',
|
||||
strokeWidth: 2,
|
||||
})
|
||||
canvas.add(gableLine)
|
||||
canvas.renderAll()
|
||||
})
|
||||
|
||||
// 처마라인의 기본속성 입력
|
||||
const eaves = []
|
||||
roofLines.forEach((currentRoof, index) => {
|
||||
if (currentRoof.attributes !== undefined && currentRoof.attributes.type === LINE_TYPE.WALLLINE.EAVES) {
|
||||
@ -1282,9 +1272,10 @@ export const drawGabledRoof = (roofId, canvas) => {
|
||||
const index = eave.index,
|
||||
currentRoof = eave.roof
|
||||
const currentWall = wallLines[index]
|
||||
const prevRoof = index === 0 ? roofLines[wallLines.length - 1] : roofLines[index - 1]
|
||||
const nextRoof = index === roofLines.length - 1 ? roofLines[0] : index === roofLines.length ? roofLines[1] : roofLines[index + 1]
|
||||
// const prevRoof = index === 0 ? roofLines[wallLines.length - 1] : roofLines[index - 1]
|
||||
// const nextRoof = index === roofLines.length - 1 ? roofLines[0] : index === roofLines.length ? roofLines[1] : roofLines[index + 1]
|
||||
|
||||
//현재 지붕의 중심 좌표
|
||||
const midX = Math.round(((currentRoof.x1 + currentRoof.x2) / 2) * 10) / 10
|
||||
const midY = Math.round(((currentRoof.y1 + currentRoof.y2) / 2) * 10) / 10
|
||||
const deltaX = currentWall.x2 - currentWall.x1
|
||||
@ -1303,6 +1294,7 @@ export const drawGabledRoof = (roofId, canvas) => {
|
||||
const checkY = Math.round((midY - signY * checkLength) * 10) / 10
|
||||
|
||||
const intersectLines = []
|
||||
// 현재 지붕의 맞은편 지붕을 찾는다.
|
||||
roofLines
|
||||
.filter((line) => line !== currentRoof)
|
||||
.forEach((line) => {
|
||||
@ -1315,6 +1307,7 @@ export const drawGabledRoof = (roofId, canvas) => {
|
||||
}
|
||||
})
|
||||
|
||||
// 가장 가까운 지붕을 찾는다.
|
||||
const intersect = intersectLines.reduce((prev, current) => {
|
||||
if (prev !== undefined) {
|
||||
const prevDistance = Math.sqrt(Math.pow(prev.x - midX, 2) + Math.pow(prev.y - midY, 2))
|
||||
@ -1400,13 +1393,6 @@ export const drawGabledRoof = (roofId, canvas) => {
|
||||
const prevRoof = index === 0 ? roofLines[wallLines.length - 1] : roofLines[index - 1]
|
||||
const nextRoof = index === roofLines.length - 1 ? roofLines[0] : index === roofLines.length ? roofLines[1] : roofLines[index + 1]
|
||||
|
||||
/*const midX = Math.round(((currentRoof.x1 + currentRoof.x2) / 2) * 10) / 10
|
||||
const midY = Math.round(((currentRoof.y1 + currentRoof.y2) / 2) * 10) / 10
|
||||
const midWallX = Math.round(((currentWall.x1 + currentWall.x2) / 2) * 10) / 10
|
||||
const midWallY = Math.round(((currentWall.y1 + currentWall.y2) / 2) * 10) / 10
|
||||
const signX = Math.sign(midX - midWallX)
|
||||
const signY = Math.sign(midY - midWallY)
|
||||
*/
|
||||
const midX = Math.round(((currentRoof.x1 + currentRoof.x2) / 2) * 10) / 10
|
||||
const midY = Math.round(((currentRoof.y1 + currentRoof.y2) / 2) * 10) / 10
|
||||
const deltaX = currentWall.x2 - currentWall.x1
|
||||
@ -1446,7 +1432,6 @@ export const drawGabledRoof = (roofId, canvas) => {
|
||||
intersectRidge.push({ line: ridge, name: 'mid' })
|
||||
}
|
||||
}
|
||||
console.log('signX : ', signX, 'signY : ', signY)
|
||||
if (Math.sign(midX - ridgeMidX) === signX || Math.sign(midY - ridgeMidY) === signY) {
|
||||
const prevIntersect = edgesIntersection(
|
||||
{ vertex1: { x: prevRoof.x1, y: prevRoof.y1 }, vertex2: { x: prevRoof.x2, y: prevRoof.y2 } },
|
||||
@ -1576,7 +1561,6 @@ export const drawGabledRoof = (roofId, canvas) => {
|
||||
}
|
||||
}
|
||||
})
|
||||
console.log('sortedPoints : ', sortedPoints)
|
||||
if (sortedPoints.length > 0) {
|
||||
const roofPolygon = new QPolygon(sortedPoints, {
|
||||
fill: 'transparent',
|
||||
@ -1587,10 +1571,26 @@ export const drawGabledRoof = (roofId, canvas) => {
|
||||
name: 'roofPolygon',
|
||||
attributes: { roofId: roof.id, currentRoof: currentRoof.id },
|
||||
})
|
||||
const currentDegree = currentRoof.attributes.pitch > 0 ? getDegreeByChon(currentRoof.attributes.pitch) : currentRoof.attributes.degree
|
||||
//지붕 각도에 따른 실측치 조정
|
||||
roofPolygon.lines.forEach((line) => {
|
||||
line.attributes.planeSize = Math.round(Math.sqrt(Math.pow(line.x2 - line.x1, 2) + Math.pow(line.y2 - line.y1, 2)) * 10)
|
||||
const slope = (line) => (line.x2 - line.x1 === 0 ? Infinity : (line.y2 - line.y1) / (line.x2 - line.x1))
|
||||
|
||||
if (currentDegree > 0 && slope(line) !== slope(currentRoof)) {
|
||||
const height = Math.tan(currentDegree * (Math.PI / 180)) * line.attributes.planeSize
|
||||
line.attributes.actualSize = Math.round(Math.sqrt(Math.pow(line.attributes.planeSize, 2) + Math.pow(height, 2)))
|
||||
} else {
|
||||
line.attributes.actualSize = line.attributes.planeSize
|
||||
}
|
||||
})
|
||||
roof.separatePolygon.push(roofPolygon)
|
||||
canvas.add(roofPolygon)
|
||||
canvas.renderAll()
|
||||
}
|
||||
})
|
||||
//기준선 제거
|
||||
ridges.forEach((ridge) => canvas.remove(ridge))
|
||||
}
|
||||
|
||||
/**
|
||||
@ -1607,7 +1607,7 @@ export const drawShedRoof = (roofId, canvas) => {
|
||||
}
|
||||
|
||||
const sheds = roof.lines.filter((line) => line.attributes !== undefined && line.attributes.type === LINE_TYPE.WALLLINE.SHED)
|
||||
const eaves = roof.lines.filter((line) => line.attributes !== undefined && line.attributes.type === LINE_TYPE.WALLLINE.EAVES)
|
||||
// const eaves = roof.lines.filter((line) => line.attributes !== undefined && line.attributes.type === LINE_TYPE.WALLLINE.EAVES)
|
||||
const gables = roof.lines.filter((line) => line.attributes !== undefined && line.attributes.type === LINE_TYPE.WALLLINE.GABLE)
|
||||
|
||||
let shedDegree = sheds[0].attributes.degree || 0
|
||||
@ -1708,16 +1708,11 @@ const drawRidge = (roof, canvas) => {
|
||||
const magnitude2 = Math.sqrt(vector2.x * vector2.x + vector2.y * vector2.y)
|
||||
const angle = (Math.acos(dotProduct / (magnitude1 * magnitude2)) * 180) / Math.PI
|
||||
|
||||
// console.log('innerRoof', innerRoof)
|
||||
// console.log('현재라인', currentRoof, '현재라인의 각도 : ', currentAngle, 'inner 라인과의 각도:', angle)
|
||||
|
||||
//현재 지붕선과 직각인 선
|
||||
if (Math.abs(angle) === 90) {
|
||||
const innerBefore = roofLines.find((line) => innerRoof.x1 === line.x2 && innerRoof.y1 === line.y2)
|
||||
const ibAngle = Math.atan2(innerBefore.y2 - innerBefore.y1, innerBefore.x2 - innerBefore.x1) * (180 / Math.PI)
|
||||
// console.log('현재라인과 직각인 선의 이전라인', innerBefore, '각도', ibAngle)
|
||||
if (Math.abs(currentAngle - ibAngle) === 180) {
|
||||
// console.log('currentRoof 의 x2,y2 좌표에서 연결된 라인')
|
||||
if (currentAngle === 0 || currentAngle === 180) {
|
||||
currentX2 = innerRoof.x1
|
||||
ridgeMinLength =
|
||||
@ -1740,7 +1735,6 @@ const drawRidge = (roof, canvas) => {
|
||||
}
|
||||
}
|
||||
if (Math.abs(currentAngle - ibAngle) === 0) {
|
||||
// console.log('currentRoof 의 x1,y1 좌표에서 연결된 라인', currentAngle)
|
||||
if (currentAngle === 0 || currentAngle === 180) {
|
||||
currentX1 = innerRoof.x2
|
||||
ridgeMinLength =
|
||||
@ -1765,7 +1759,6 @@ const drawRidge = (roof, canvas) => {
|
||||
}
|
||||
//현재 지붕선과 반대인 선
|
||||
if (Math.abs(angle) === 180) {
|
||||
// console.log('현재라인과 반대인 선')
|
||||
if (currentAngle === 0 || currentAngle === 180) {
|
||||
}
|
||||
if (currentAngle === 90 || currentAngle === 270) {
|
||||
@ -1829,8 +1822,6 @@ const drawRidge = (roof, canvas) => {
|
||||
const hypo = Math.sqrt(Math.pow(Math.abs(startXPoint - endXPoint), 2) + Math.pow(Math.abs(startYPoint - endYPoint), 2))
|
||||
|
||||
const intersectLength = Math.sqrt(Math.pow(Math.abs(midX - intersectLine.x), 2) + Math.pow(Math.abs(midY - intersectLine.y), 2))
|
||||
console.log('intersect 좌표까지의 거리 : ', intersectLength)
|
||||
console.log('hypotenuse', hypo, 'ridgeMinLength', ridgeMinLength)
|
||||
if (intersectLength < prevRoof.attributes.planeSize / 10 && intersectLength < nextRoof.attributes.planeSize / 10) {
|
||||
endXPoint = startXPoint
|
||||
endYPoint = startYPoint
|
||||
@ -1844,7 +1835,6 @@ const drawRidge = (roof, canvas) => {
|
||||
endXPoint = Math.round(startXPoint + Math.sign(alpha) * -1 * ridgeMinLength)
|
||||
endYPoint = Math.round(startYPoint + Math.sign(beta) * -1 * ridgeMinLength)
|
||||
}
|
||||
console.log('startXPoint', startXPoint, 'startYPoint', startYPoint, 'endXPoint', endXPoint, 'endYPoint', endYPoint)
|
||||
|
||||
const ridge = new QLine([startXPoint, startYPoint, endXPoint, endYPoint], {
|
||||
fontSize: roof.fontSize,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user