diff --git a/src/hooks/module/useModuleBasicSetting.js b/src/hooks/module/useModuleBasicSetting.js index 067d9f8a..7a72a379 100644 --- a/src/hooks/module/useModuleBasicSetting.js +++ b/src/hooks/module/useModuleBasicSetting.js @@ -9,9 +9,9 @@ import { QLine } from '@/components/fabric/QLine' import { moduleSetupSurfaceState, moduleIsSetupState } from '@/store/canvasAtom' import { useEvent } from '@/hooks/useEvent' import { POLYGON_TYPE, BATCH_TYPE } from '@/common/common' - import * as turf from '@turf/turf' import { EventContext } from '@/app/floor-plan/EventProvider' +import { v4 as uuidv4 } from 'uuid' export function useModuleBasicSetting() { const canvas = useRecoilValue(canvasState) @@ -20,7 +20,6 @@ export function useModuleBasicSetting() { const [moduleIsSetup, setModuleIsSetup] = useRecoilState(moduleIsSetupState) const { addTargetMouseEventListener, addCanvasMouseEventListener, initEvent } = useEvent() // const { addTargetMouseEventListener, addCanvasMouseEventListener, initEvent } = useContext(EventContext) - const [flowModuleLine, setFlowModuleLine] = useState({}) let selectedModuleInstSurfaceArray = [] const makeModuleInstArea = () => { @@ -35,6 +34,9 @@ export function useModuleBasicSetting() { setSurfaceShapePattern(roof, roofDisplay.column, true) //패턴 변경 const offsetPoints = offsetPolygon(roof.points, -20) //안쪽 offset //모듈설치영역?? 생성 + + const surfaceId = uuidv4() + let setupSurface = new QPolygon(offsetPoints, { stroke: 'red', fill: 'transparent', @@ -51,16 +53,20 @@ export function useModuleBasicSetting() { flowDirection: roof.direction, flipX: roof.flipX, flipY: roof.flipY, + surfaceId: surfaceId, }) setupSurface.setViewLengthText(false) - - canvas.add(setupSurface) + canvas.add(setupSurface) //모듈설치면 만들기 if (setupSurface.flowDirection === 'south' || setupSurface.flowDirection === 'north') { - setFlowModuleLine(bottomTopFlowLine(setupSurface)) + setupSurface.set({ + flowLines: bottomTopFlowLine(setupSurface), + }) } else { - setFlowModuleLine(leftRightFlowLine(setupSurface)) + setupSurface.set({ + flowLines: leftRightFlowLine(setupSurface), + }) } //지붕면 선택 금지 @@ -392,11 +398,10 @@ export function useModuleBasicSetting() { //자동 모듈 설치(그리드 방식) const autoModuleSetup = (placementRef) => { - const isChidori = placementRef.isChidori.current + const isChidori = placementRef.isChidori.current === 'true' ? true : false const setupLocation = placementRef.setupLocation.current const isMaxSetup = placementRef.isMaxSetup.current - initEvent() const moduleSetupSurfaces = moduleSetupSurface //선택 설치면 const notSelectedTrestlePolygons = canvas @@ -425,6 +430,13 @@ export function useModuleBasicSetting() { }) } + //어짜피 자동으로 누르면 선택안된데도 다 날아간다 + canvas.getObjects().forEach((obj) => { + if (obj.name === 'module') { + canvas.remove(obj) + } + }) + notSelectedTrestlePolygons.forEach((obj) => { if (obj.modules) { obj.modules.forEach((module) => { @@ -434,19 +446,27 @@ export function useModuleBasicSetting() { } }) - const moduleSetupArray = [] - moduleSetupSurfaces.forEach((moduleSetupSurface, index) => { - moduleSetupSurface.fire('mousedown') + const moduleOptions = { + fill: '#BFFD9F', + stroke: 'black', + strokeWidth: 0.1, + selectable: false, // 선택 가능하게 설정 + lockMovementX: true, // X 축 이동 잠금 + lockMovementY: true, // Y 축 이동 잠금 + lockRotation: true, // 회전 잠금 + lockScalingX: true, // X 축 크기 조정 잠금 + lockScalingY: true, // Y 축 크기 조정 잠금 + opacity: 0.8, + parentId: moduleSetupSurface.parentId, + name: 'module', + } - const surfaceMaxLines = findSetupSurfaceMaxLines(moduleSetupSurface) + let leftMargin, bottomMargin, square, chidoriLength - let maxLengthLine = moduleSetupSurface.lines.reduce((acc, cur) => { - return acc.length > cur.length ? acc : cur - }) - - const turfModuleSetupSurface = polygonToTurfPolygon(moduleSetupSurface) //폴리곤을 turf 객체로 변환 - - const containsBatchObjects = batchObjects.filter((batchObject) => { + //선택된 지붕안에 오브젝트(도머, 개구등)이 있는지 확인하는 로직 포함되면 배열 반환 + const objectsIncludeSurface = (turfModuleSetupSurface) => { + let containsBatchObjects = [] + containsBatchObjects = batchObjects.filter((batchObject) => { let convertBatchObject if (batchObject.type === 'group') { @@ -454,9 +474,7 @@ export function useModuleBasicSetting() { convertBatchObject = batchObjectGroupToTurfPolygon(batchObject) } else { //개구, 그림자 - batchObject.set({ - points: rectToPolygon(batchObject), - }) + batchObject.set({ points: rectToPolygon(batchObject) }) canvas?.renderAll() // set된걸 바로 적용하기 위해 convertBatchObject = polygonToTurfPolygon(batchObject) //rect를 폴리곤으로 변환 -> turf 폴리곤으로 변환 } @@ -465,19 +483,226 @@ export function useModuleBasicSetting() { return turf.booleanContains(turfModuleSetupSurface, convertBatchObject) || turf.booleanWithin(convertBatchObject, turfModuleSetupSurface) }) - let difference = turfModuleSetupSurface //기본 객체(면형상) + return containsBatchObjects + } + + /** + * 도머나 개구가 모듈에 걸치는지 확인하는 로직 + * @param {*} squarePolygon + * @param {*} containsBatchObjects + * @returns + */ + const checkModuleDisjointObjects = (squarePolygon, containsBatchObjects) => { + let isDisjoint = false if (containsBatchObjects.length > 0) { - //turf로 도머를 제외시키는 로직 - for (let i = 0; i < containsBatchObjects.length; i++) { - let convertBatchObject - if (containsBatchObjects[i].type === 'group') { - convertBatchObject = batchObjectGroupToTurfPolygon(containsBatchObjects[i]) + let convertBatchObject + //도머가 있으면 적용되는 로직 + isDisjoint = containsBatchObjects.every((batchObject) => { + if (batchObject.type === 'group') { + convertBatchObject = batchObjectGroupToTurfPolygon(batchObject) } else { - convertBatchObject = polygonToTurfPolygon(containsBatchObjects[i]) + convertBatchObject = polygonToTurfPolygon(batchObject) } + /** + * 도머가 여러개일수있으므로 겹치는게 있다면... + * 안겹치는지 확인하는 로직이라 안겹치면 true를 반환 + */ + return turf.booleanDisjoint(squarePolygon, convertBatchObject) + }) + } else { + isDisjoint = true + } + return isDisjoint + } + + /** + * 배치면 안에 있는지 확인 + * @param {*} squarePolygon + * @param {*} turfModuleSetupSurface + * @returns + */ + const checkModuleDisjointSurface = (squarePolygon, turfModuleSetupSurface) => { + return turf.booleanContains(turfModuleSetupSurface, squarePolygon) || turf.booleanWithin(squarePolygon, turfModuleSetupSurface) + } + + const downFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine) => { + const maxLeftEndPoint = surfaceMaxLines.left.x1 //최 좌측 + const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측 + const maxTopEndPoint = surfaceMaxLines.top.y1 //최 상단 + + let startPoint = flowModuleLine.find((obj) => obj.target === 'bottom') + + let totalLeftEndPoint = maxLeftEndPoint - startPoint.x1 + let totalTopEndPoint = maxTopEndPoint - startPoint.y1 + let totalWidth = Math.ceil(Math.abs(maxRightEndPoint - maxLeftEndPoint) / width) + let diffLeftEndPoint = Math.abs(totalLeftEndPoint / width) + let diffTopEndPoint = Math.abs(totalTopEndPoint / height) + let startColPoint = Math.abs(width * Math.ceil(diffLeftEndPoint) - startPoint.x1) + + for (let j = 0; j < diffTopEndPoint; j++) { + bottomMargin = j === 0 ? 1 : 0 + for (let i = 0; i <= totalWidth; i++) { + leftMargin = i === 0 ? 1 : 0 //숫자가 0이면 0, 1이면 1로 바꾸기 + chidoriLength = 0 + if (isChidori) { + chidoriLength = j % 2 === 0 ? 0 : width / 2 + } + + square = [ + [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - bottomMargin], + [startColPoint + width * i + width - chidoriLength, startPoint.y1 - height * j - bottomMargin], + [startColPoint + width * i + width - chidoriLength, startPoint.y1 - height * j - height - bottomMargin], + [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - height - bottomMargin], + [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - bottomMargin], + ] + + let squarePolygon = turf.polygon([square]) + let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1) + let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) + + // if (disjointFromTrestle && isDisjoint) { + let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) + canvas?.add(tempModule) + moduleSetupArray.push(tempModule) } } + } + + const leftFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine) => { + let startPoint = flowModuleLine.find((obj) => obj.target === 'left') + + const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측 + const maxTopEndPoint = surfaceMaxLines.top.y1 //최 상단 + const maxBottomEndPoint = surfaceMaxLines.bottom.y1 //최하단 + let totalTopEndPoint = Math.abs(maxTopEndPoint - startPoint.y1) //전체 높이에서 현재 높이를 뺌 + let diffTopEndPoint = Math.abs(totalTopEndPoint / height) + let totalHeight = Math.ceil(Math.abs(maxBottomEndPoint - maxTopEndPoint) / height) + let totalWidth = Math.abs(startPoint.x1 - maxRightEndPoint) / width + let startRowPoint = startPoint.y1 - height * Math.ceil(diffTopEndPoint) + + for (let j = 0; j < totalHeight; j++) { + bottomMargin = j === 0 ? 1 : 0 + for (let i = 0; i <= totalWidth; i++) { + leftMargin = 1 + chidoriLength = 0 + if (isChidori) { + chidoriLength = i % 2 === 0 ? 0 : height / 2 + } + + square = [ + [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength], + [startPoint.x1 + width * i + width + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength], + [startPoint.x1 + width * i + width + leftMargin, startRowPoint + height * j + height + bottomMargin - chidoriLength], + [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + height + bottomMargin - chidoriLength], + [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength], + ] + + console.log('square', square) + + let squarePolygon = turf.polygon([square]) + let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1) + let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) + + // if (disjointFromTrestle && isDisjoint) { + let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) + canvas?.add(tempModule) + moduleSetupArray.push(tempModule) + } + } + } + + const topFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine) => { + let startPoint = flowModuleLine.find((obj) => obj.target === 'top') + const maxLeftEndPoint = surfaceMaxLines.left.x1 //최 좌측 + const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측 + + const maxBottomEndPoint = surfaceMaxLines.bottom.y1 //최하단 + let totalLeftEndPoint = maxLeftEndPoint - startPoint.x1 + let totalRightEndPoint = maxLeftEndPoint - maxRightEndPoint + let totalBottomEndPoint = maxBottomEndPoint - startPoint.y1 + let diffLeftEndPoint = Math.abs(totalLeftEndPoint / width) + let diffRightEndPoint = Math.abs(totalRightEndPoint / width) + let diffBottomEndPoint = Math.abs(totalBottomEndPoint / height) + let startColPoint = Math.abs(width * Math.ceil(diffLeftEndPoint) - startPoint.x1) + + for (let j = 0; j < diffBottomEndPoint; j++) { + for (let i = 0; i < diffRightEndPoint; i++) { + chidoriLength = 0 + if (isChidori) { + chidoriLength = j % 2 === 0 ? 0 : width / 2 + } + square = [ + [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j + 1], + [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j + height + 1], + [startColPoint + width * i + width + chidoriLength, startPoint.y1 + height * j + height + 1], + [startColPoint + width * i + width + chidoriLength, startPoint.y1 + height * j + 1], + [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j + 1], + ] + + let squarePolygon = turf.polygon([square]) + let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1) + let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) + + // if (disjointFromTrestle && isDisjoint) { + let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) + canvas?.add(tempModule) + moduleSetupArray.push(tempModule) + } + } + } + + const rightFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine) => { + let startPoint = flowModuleLine.find((obj) => obj.target === 'right') + const maxLeftEndPoint = surfaceMaxLines.left.x1 //최 좌측 + + const maxTopEndPoint = surfaceMaxLines.top.y1 //최 상단 + const maxBottomEndPoint = surfaceMaxLines.bottom.y1 //최하단 + let totalTopEndPoint = Math.abs(maxTopEndPoint - startPoint.y1) //전체 높이에서 현재 높이를 뺌 + let diffTopEndPoint = Math.abs(totalTopEndPoint / height) + let totalHeight = Math.ceil(Math.abs(maxBottomEndPoint - maxTopEndPoint) / height) + let totalWidth = Math.abs(startPoint.x1 - maxLeftEndPoint) / width + let startRowPoint = startPoint.y1 - height * Math.ceil(diffTopEndPoint) + + for (let j = 0; j < totalHeight; j++) { + bottomMargin = j === 0 ? 1 : 0 + for (let i = 0; i <= totalWidth; i++) { + leftMargin = 1 + chidoriLength = 0 + if (isChidori) { + chidoriLength = i % 2 === 0 ? 0 : height / 2 + } + + square = [ + [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j + bottomMargin + chidoriLength], + [startPoint.x1 - width * i - width - leftMargin, startRowPoint + height * j + bottomMargin + chidoriLength], + [startPoint.x1 - width * i - width - leftMargin, startRowPoint + height * j + height + bottomMargin + chidoriLength], + [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j + height + bottomMargin + chidoriLength], + [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j + bottomMargin + chidoriLength], + ] + + let squarePolygon = turf.polygon([square]) + let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1) + let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) + + // if (disjointFromTrestle && isDisjoint) { + let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon }) + canvas?.add(tempModule) + moduleSetupArray.push(tempModule) + } + } + } + + moduleSetupSurfaces.forEach((moduleSetupSurface, index) => { + moduleSetupSurface.fire('mousedown') + const moduleSetupArray = [] + + let maxLengthLine = moduleSetupSurface.lines.reduce((acc, cur) => { + return acc.length > cur.length ? acc : cur + }) + + const turfModuleSetupSurface = polygonToTurfPolygon(moduleSetupSurface) //폴리곤을 turf 객체로 변환 + const containsBatchObjects = objectsIncludeSurface(turfModuleSetupSurface) //배치면에 오브젝트(도머, 개구등)이 있는지 확인하는 로직 let width = maxLengthLine.flowDirection === 'east' || maxLengthLine.flowDirection === 'west' ? 172.2 : 113.4 let height = maxLengthLine.flowDirection === 'east' || maxLengthLine.flowDirection === 'west' ? 113.4 : 172.2 @@ -488,102 +713,56 @@ export function useModuleBasicSetting() { height = moduleSetupSurface.flowDirection === 'south' || moduleSetupSurface.flowDirection === 'north' ? 113.4 : 172.2 } - let square - let startPoint, endPoint + const surfaceMaxLines = findSetupSurfaceMaxLines(moduleSetupSurface) + //처마면 배치 if (setupLocation === 'eaves') { + // 흐름방향이 남쪽일때 if (moduleSetupSurface.flowDirection === 'south') { - startPoint = flowModuleLine.find((obj) => obj.target === 'bottom') - endPoint = flowModuleLine.find((obj) => obj.target === 'top') - const totalHeight = endPoint.y1 - startPoint.y1 - const diffHeight = Math.abs(totalHeight / height) - let leftMargin = 0 - let bottomMargin = 0 - - for (let i = 0; i < diffHeight; i++) { - leftMargin = i === 0 ? 1 : 0 - bottomMargin = i === 0 ? 0 : 1 - - square = [ - [startPoint.x1 + leftMargin, startPoint.y1 - height - bottomMargin], - [startPoint.x1 + leftMargin, startPoint.y1 - bottomMargin], - [startPoint.x1 + leftMargin + width, startPoint.y1 - bottomMargin], - [startPoint.x1 + leftMargin + width, startPoint.y1 - height - bottomMargin], - [startPoint.x1 + leftMargin, startPoint.y1 - height - bottomMargin], - ] - - const squarePolygon = turf.polygon([square]) - - //설치면 안에 있는지 확인 - const disjointFromTrestle = - turf.booleanContains(turfModuleSetupSurface, squarePolygon) || turf.booleanWithin(squarePolygon, turfModuleSetupSurface) - - if (disjointFromTrestle) { - let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1) - const points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] })) - - if (containsBatchObjects.length > 0) { - let convertBatchObject - //도머가 있으면 적용되는 로직 - const isDisjoint = containsBatchObjects.every((batchObject) => { - if (batchObject.type === 'group') { - convertBatchObject = batchObjectGroupToTurfPolygon(batchObject) - } else { - convertBatchObject = polygonToTurfPolygon(batchObject) - } - return turf.booleanDisjoint(squarePolygon, convertBatchObject) //도머가 여러개일수있으므로 겹치는게 있다면... - }) - if (isDisjoint) { - const tempModule = new QPolygon(points, { - fill: '#BFFD9F', - stroke: 'black', - strokeWidth: 0.1, - selectable: true, // 선택 가능하게 설정 - lockMovementX: false, // X 축 이동 잠금 - lockMovementY: false, // Y 축 이동 잠금 - lockRotation: false, // 회전 잠금 - lockScalingX: false, // X 축 크기 조정 잠금 - lockScalingY: false, // Y 축 크기 조정 잠금 - opacity: 0.8, - parentId: moduleSetupSurface.parentId, - name: 'module', - }) - tempModule.setViewLengthText(false) - canvas?.add(tempModule) - moduleSetupArray.push(tempModule) - } - } else { - //도머가 없을땐 그냥 그림 - const tempModule = new QPolygon(points, { - fill: '#BFFD9F', - stroke: 'black', - selectable: true, // 선택 가능하게 설정 - lockMovementX: true, // X 축 이동 잠금 - lockMovementY: true, // Y 축 이동 잠금 - lockRotation: true, // 회전 잠금 - lockScalingX: true, // X 축 크기 조정 잠금 - lockScalingY: true, // Y 축 크기 조정 잠금 - opacity: 0.8, - parentId: moduleSetupSurface.parentId, - name: 'module', - }) - canvas?.add(tempModule) - moduleSetupArray.push(tempModule) - } - startPoint = { x1: points[0].x, y1: points[0].y, x2: points[3].x, y2: points[3].y } - } - } + downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + } + if (moduleSetupSurface.flowDirection === 'west') { + leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + } + if (moduleSetupSurface.flowDirection === 'east') { + rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + } + if (moduleSetupSurface.flowDirection === 'north') { + topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) } } else if (setupLocation === 'ridge') { + if (moduleSetupSurface.flowDirection === 'south') { + topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + } + if (moduleSetupSurface.flowDirection === 'west') { + rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + } + if (moduleSetupSurface.flowDirection === 'east') { + leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + } + if (moduleSetupSurface.flowDirection === 'north') { + downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines) + } } else { } - moduleSetupSurface.set({ modules: moduleSetupArray }) + const setupedModules = moduleSetupArray.filter((module) => { + let disjointFromTrestle = checkModuleDisjointSurface(module.turfPoints, turfModuleSetupSurface) + let isDisjoint = checkModuleDisjointObjects(module.turfPoints, containsBatchObjects) + + if (!(disjointFromTrestle && isDisjoint)) { + // canvas?.remove(module) + module.set({ fill: 'rgba(255,190,41, 0.4)', stroke: 'black', strokeWidth: 1 }) + return false + } else { + return module + } + }) + moduleSetupSurface.set({ modules: setupedModules }) + setModuleIsSetup(moduleSetupArray) }) - setModuleIsSetup(moduleSetupArray) - - console.log(calculateForApi(moduleSetupArray)) + // console.log(calculateForApi(moduleSetupArray)) } const calculateForApi = (moduleSetupArray) => { @@ -744,9 +923,8 @@ export function useModuleBasicSetting() { ) flowArray.push(topFlow) - let idx = 0 let rtnObjArray = [] - flowArray.forEach((center) => { + flowArray.forEach((center, index) => { const linesArray = new Array() surface.lines.filter((line) => { @@ -785,12 +963,6 @@ export function useModuleBasicSetting() { const h = beta * Math.sin((angle1 * Math.PI) / 180) // 높이 const sign = Math.sign(coords[0].y - coords[1].y) // 진행방향 const top = coords[1].y + sign * h // 변경되는 높이 좌표 값 - // const line3 = new QLine([coords[1].x, coords[1].y, coords[1].x, top], { - // stroke: 'blue', - // strokeWidth: 1, - // selectable: true, - // }) - // // canvas?.add(line3) const pointX1 = coords[0].x + ((coords[0].y - top) / (coords[0].y - coords[1].y)) * (coords[1].x - coords[0].x) const pointY1 = top @@ -805,9 +977,39 @@ export function useModuleBasicSetting() { canvas?.add(finalLine) canvas?.renderAll() - const rtnObj = { target: idx === 0 ? 'bottom' : 'top', x1: pointX1, y1: pointY1, x2: pointX2, y2: pointY2 } + let rtnObj + //평평하면 + if (alpha === 0 || beta === 0 || h === 0 || sign === 0) { + //꼭지점이 없고 평평할때 ex) 네모 + let standardLine + if (index === 0) { + //bottom + standardLine = surface.lines.reduce((acc, line, index) => { + if (line.y1 > acc.y1 || (line.y1 === acc.y1 && line.y2 > acc.y2)) { + return { x1: line.x1, y1: line.y1, index: index } + } + return acc + }) + } else { + standardLine = surface.lines.reduce((acc, line, index) => { + if (line.y1 < acc.y1 || (line.y1 === acc.y1 && line.y2 < acc.y2)) { + return { x1: line.x1, y1: line.y1, index: index } + } + return acc + }) + } + rtnObj = { + target: index === 0 ? 'bottom' : 'top', + x1: standardLine.x1, + y1: standardLine.y1, + x2: standardLine.x1 + charlie, + y2: standardLine.y1, + } + } else { + rtnObj = { target: index === 0 ? 'bottom' : 'top', x1: pointX1, y1: pointY1, x2: pointX2, y2: pointY2 } + } + rtnObjArray.push(rtnObj) - ++idx }) return rtnObjArray @@ -839,7 +1041,7 @@ export function useModuleBasicSetting() { let idx = 0 let rtnObjArray = [] - flowArray.forEach((center) => { + flowArray.forEach((center, index) => { const linesArray = surface.lines.filter((line) => { if ((center.x1 === line.x1 && center.y1 === line.y1) || (center.x1 === line.x2 && center.y1 === line.y2)) { return line @@ -898,10 +1100,40 @@ export function useModuleBasicSetting() { canvas?.add(finalLine) canvas?.renderAll() - const rtnObj = { target: idx === 0 ? 'left' : 'right', x1: pointX1, y1: pointY1, x2: pointX2, y2: pointY2 } + let rtnObj + //평평하면 + if (alpha === 0 || beta === 0 || h === 0 || sign === 0) { + //꼭지점이 없고 평평할때 ex) 네모 + let standardLine + if (index === 0) { + //bottom + standardLine = surface.lines.reduce((acc, line, index) => { + if (line.x1 < acc.x1 || (line.x1 === acc.x1 && line.y1 < acc.y1)) { + return { x1: line.x1, y1: line.y1, index: index } + } + return acc + }) + } else { + standardLine = surface.lines.reduce((acc, line, index) => { + if (line.x1 > acc.x1 || (line.x1 === acc.x1 && line.y1 > acc.y1)) { + return { x1: line.x1, y1: line.y1, index: index } + } + return acc + }) + } + rtnObj = { + target: index === 0 ? 'left' : 'right', + x1: standardLine.x1, + y1: standardLine.y1, + x2: standardLine.x1, + y2: standardLine.y1 + charlie, + } + } else { + rtnObj = { target: idx === 0 ? 'left' : 'right', x1: pointX1, y1: pointY1, x2: pointX2, y2: pointY2 } + } rtnObjArray.push(rtnObj) - ++idx }) + return rtnObjArray } const findSetupSurfaceMaxLines = (surface) => {