diff --git a/src/components/fabric/QPolygon.js b/src/components/fabric/QPolygon.js index 0f7bd815..e400d80a 100644 --- a/src/components/fabric/QPolygon.js +++ b/src/components/fabric/QPolygon.js @@ -188,7 +188,6 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, { // 보조선 그리기 drawHelpLine() { - // drawHelpLineInHexagon(this, pitch) const types = [] this.lines.forEach((line) => types.push(line.attributes.type)) diff --git a/src/hooks/roofcover/useMovementSetting.js b/src/hooks/roofcover/useMovementSetting.js index ced2e72b..6e06212e 100644 --- a/src/hooks/roofcover/useMovementSetting.js +++ b/src/hooks/roofcover/useMovementSetting.js @@ -5,6 +5,7 @@ import { useMessage } from '@/hooks/useMessage' import { useEffect, useRef, useState } from 'react' import { useEvent } from '@/hooks/useEvent' import { LINE_TYPE, POLYGON_TYPE } from '@/common/common' +import { getDegreeByChon } from '@/util/canvas-util' //동선이동 형 올림 내림 export function useMovementSetting(id) { @@ -227,6 +228,20 @@ export function useMovementSetting(id) { } }) polygon.set({ points: newPoints }) + polygon.setCoords() + polygon.addLengthText() + polygon.initLines() + const slope = (line) => (line.x2 - line.x1 === 0 ? Infinity : (line.y2 - line.y1) / (line.x2 - line.x1)) + const currentDegree = polygon.attributes.pitch > 0 ? getDegreeByChon(polygon.attributes.pitch) : polygon.attributes.degree + polygon.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) + if (currentDegree > 0 && slope(line) !== slope(currentObject)) { + 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 + } + }) }) } else { roof.innerLines @@ -239,7 +254,7 @@ export function useMovementSetting(id) { (line.x2 === currentX2 && line.y2 === currentY2), ) .forEach((line) => { - console.log('line : ', line) + const lineDegree = 90 - Math.asin(line.attributes.planeSize / line.attributes.actualSize) * (180 / Math.PI) if (line.x1 === currentX1 && line.y1 === currentY1) { line.set({ x1: newPoint[0], y1: newPoint[1] }) } else if (line.x2 === currentX1 && line.y2 === currentY1) { @@ -250,20 +265,18 @@ export function useMovementSetting(id) { line.set({ x2: newPoint[2], y2: newPoint[3] }) } line.setCoords() + line.attributes.planeSize = Math.round(Math.sqrt(Math.pow(line.x2 - line.x1, 2) + Math.pow(line.y2 - line.y1, 2)) * 10) + line.attributes.actualSize = Math.round( + Math.sqrt(Math.pow(line.attributes.planeSize, 2) + Math.pow(line.attributes.planeSize * Math.tan(lineDegree * (Math.PI / 180)), 2)), + ) }) } currentObject.set({ x1: cloned.x1, y1: cloned.y1, x2: cloned.x2, y2: cloned.y2 }) currentObject.setCoords() - console.log('currentObject : ', currentObject.x1, currentObject.y1, currentObject.x2, currentObject.y2) - canvas.renderAll() canvas.discardActiveObject() - - if (roof.separatePolygon.length > 0) { - console.log('roof.separatePolygon : ', roof.separatePolygon) - } } //형 올림내림 마우스 클릭 이벤트 diff --git a/src/util/qpolygon-utils.js b/src/util/qpolygon-utils.js index b2253953..63c04e89 100644 --- a/src/util/qpolygon-utils.js +++ b/src/util/qpolygon-utils.js @@ -1109,7 +1109,6 @@ const drawHips = (roof, canvas) => { const vectorX2 = ridgeCoordinate.x1 - currentRoof.x2 const vectorY2 = ridgeCoordinate.y1 - currentRoof.y2 const angle2 = Math.atan2(vectorY2, vectorX2) * (180 / Math.PI) - console.log('angle2', Math.abs(Math.round(angle2)) % 45) if (Math.abs(Math.round(angle2)) % 45 === 0) { const hip2 = new QLine([currentRoof.x2, currentRoof.y2, ridgeCoordinate.x1, ridgeCoordinate.y1], { fontSize: roof.fontSize,