ab템플릿 타입 셀 위치 정렬
This commit is contained in:
yjnoh
parent
a7d725cff0
commit
239bcef815
@ -542,9 +542,10 @@ export default function Roof2() {
|
||||
{/*<Button className="m-1 p-2" onClick={zoomIn}>
|
||||
확대
|
||||
</Button>
|
||||
*/}
|
||||
<Button className="m-1 p-2" onClick={zoomOut}>
|
||||
축소
|
||||
</Button>*/}
|
||||
</Button>
|
||||
현재 줌 : {zoom}%
|
||||
<Button className="m-1 p-2" onClick={makeLine}>
|
||||
선 추가
|
||||
|
||||
@ -2,7 +2,7 @@ import { fabric } from 'fabric'
|
||||
import { v4 as uuidv4 } from 'uuid'
|
||||
import { QLine } from '@/components/fabric/QLine'
|
||||
import { distanceBetweenPoints, findTopTwoIndexesByDistance, getDirectionByPoint, sortedPointLessEightPoint, sortedPoints } from '@/util/canvas-util'
|
||||
import { calculateAngle, dividePolygon, drawHelpLineInHexagon, splitPolygonWithLines , drawHippedRoof} from '@/util/qpolygon-utils'
|
||||
import { calculateAngle, dividePolygon, drawHelpLineInHexagon } from '@/util/qpolygon-utils'
|
||||
|
||||
export const QPolygon = fabric.util.createClass(fabric.Polygon, {
|
||||
type: 'QPolygon',
|
||||
@ -275,7 +275,7 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
|
||||
this.cells = drawCellsArray
|
||||
return drawCellsArray
|
||||
},
|
||||
fillCellABTemplate(cell = { width: 50, height: 100, padding: 5, parallelPoint: undefined, startX: 0, startY: 0 }) {
|
||||
fillCellABType(cell = { width: 50, height: 100, padding: 5, wallDirection: 'left', referenceDirection: 'none', startIndex: -1 }) {
|
||||
const points = this.points
|
||||
|
||||
const minX = Math.min(...points.map((p) => p.x)) //왼쪽
|
||||
@ -293,58 +293,224 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
|
||||
const rows = Math.floor((boundingBoxHeight + cell.padding) / (rectHeight + cell.padding))
|
||||
|
||||
//전체 높이에서 패딩을 포함하고 rows를 곱해서 여백길이를 계산 후에 2로 나누면 반높이를 넣어서 중간으로 정렬
|
||||
const tmpHeight = (boundingBoxHeight - (rectHeight + cell.padding) * rows) / 2
|
||||
//센터 정렬시에 쓴다 체크박스가 존재함 TODO: if문 추가해서 정렬해야함
|
||||
const tmpWidth = (boundingBoxWidth - (rectWidth + cell.padding) * cols) / 2
|
||||
|
||||
let centerHeight = rows > 1 ? (boundingBoxHeight - (rectHeight + cell.padding / 2) * rows) / 2 : (boundingBoxHeight - rectHeight * rows) / 2 //rows 1개 이상이면 cell 을 반 나눠서 중간을 맞춘다
|
||||
let centerWidth = cols > 1 ? (boundingBoxWidth - (rectWidth + cell.padding / 2) * cols) / 2 : (boundingBoxWidth - rectWidth * cols) / 2
|
||||
|
||||
const drawCellsArray = [] //그려진 셀의 배열
|
||||
|
||||
let idx = 1
|
||||
|
||||
if (cell.parallelPoint > -1) {
|
||||
//4각형 이상이면 각 꼭지점에서 위, 아래로 이동하면서 채움
|
||||
//앞에서 -1로 선언함
|
||||
if (cell.parallelPoint === 1 || cell.parallelPoint === 2) {
|
||||
//ㄴ자 역ㄱ자
|
||||
//밑에서 위로 올라가야하면
|
||||
cell.startY = cell.startY - (rectHeight + cell.padding) * rows
|
||||
if (cell.parallelPoint === 2) {
|
||||
cell.startX = cell.startX - (rectWidth + cell.padding) * cols
|
||||
}
|
||||
} else {
|
||||
if (cell.parallelPoint === 5) {
|
||||
cell.startX = cell.startX - (rectWidth + cell.padding) * cols
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
let startXPos, startYPos
|
||||
|
||||
for (let i = 0; i < cols; i++) {
|
||||
for (let j = 0; j < rows; j++) {
|
||||
if (cell.parallelPoint > -1) {
|
||||
startXPos = cell.startX + i * (rectWidth + cell.padding)
|
||||
startYPos = cell.startY + j * (rectHeight + cell.padding)
|
||||
} else {
|
||||
startXPos = minX + i * (rectWidth + cell.padding)
|
||||
startYPos = minY + j * (rectHeight + cell.padding)
|
||||
}
|
||||
|
||||
const rectPoints = []
|
||||
|
||||
rectPoints.push(
|
||||
{ x: startXPos, y: startYPos },
|
||||
{ x: startXPos + rectWidth, y: startYPos },
|
||||
{ x: startXPos, y: startYPos + rectHeight },
|
||||
{ x: startXPos + rectWidth, y: startYPos + rectHeight },
|
||||
)
|
||||
if (cell.referenceDirection !== 'none') {
|
||||
//4각형은 기준점이 없다
|
||||
|
||||
const allPointsInside = rectPoints.every((point) => this.inPolygon(point))
|
||||
if (cell.referenceDirection === 'top') {
|
||||
//top, bottom은 A패턴만
|
||||
if (cell.wallDirection === 'left') {
|
||||
startXPos = minX + i * rectWidth
|
||||
startYPos = minY + j * rectHeight
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos + i * cell.padding //옆으로 패딩
|
||||
}
|
||||
} else {
|
||||
startXPos = maxX - (1 + i) * rectWidth - 0.01
|
||||
startYPos = minY + j * rectHeight + 0.01
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos - i * cell.padding //옆으로 패딩
|
||||
}
|
||||
}
|
||||
|
||||
if (j > 0) {
|
||||
startYPos = startYPos + j * cell.padding
|
||||
}
|
||||
|
||||
rectPoints.push(
|
||||
{ x: startXPos, y: startYPos },
|
||||
{ x: startXPos + rectWidth, y: startYPos },
|
||||
{ x: startXPos, y: startYPos + rectHeight },
|
||||
{ x: startXPos + rectWidth, y: startYPos + rectHeight },
|
||||
)
|
||||
} else if (cell.referenceDirection === 'bottom') {
|
||||
if (cell.wallDirection === 'left') {
|
||||
startXPos = minX + i * rectWidth
|
||||
startYPos = maxY - j * rectHeight - 0.01
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos + i * cell.padding
|
||||
}
|
||||
|
||||
rectPoints.push(
|
||||
{ x: startXPos, y: startYPos },
|
||||
{ x: startXPos + rectWidth, y: startYPos },
|
||||
{ x: startXPos, y: startYPos - rectHeight },
|
||||
{ x: startXPos + rectWidth, y: startYPos - rectHeight },
|
||||
)
|
||||
} else {
|
||||
startXPos = maxX - i * rectWidth - 0.01
|
||||
startYPos = maxY - j * rectHeight - 0.01
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos - i * cell.padding
|
||||
}
|
||||
|
||||
rectPoints.push(
|
||||
{ x: startXPos, y: startYPos },
|
||||
{ x: startXPos - rectWidth, y: startYPos },
|
||||
{ x: startXPos, y: startYPos - rectHeight },
|
||||
{ x: startXPos - rectWidth, y: startYPos - rectHeight },
|
||||
)
|
||||
startXPos = startXPos - rectWidth //우 -> 좌 들어가야해서 마이너스 처리
|
||||
}
|
||||
startYPos = startYPos - rectHeight //밑에서 위로 올라가는거라 마이너스 처리
|
||||
|
||||
if (j > 0) {
|
||||
startYPos = startYPos - j * cell.padding
|
||||
}
|
||||
} else if (cell.referenceDirection === 'left') {
|
||||
//여기서부턴 B패턴임
|
||||
if (cell.wallDirection === 'top') {
|
||||
startXPos = minX + i * rectWidth
|
||||
startYPos = minY + j * rectHeight
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos + i * cell.padding //밑으로
|
||||
}
|
||||
if (j > 0) {
|
||||
startYPos = startYPos + j * cell.padding //옆으로 패딩
|
||||
}
|
||||
|
||||
rectPoints.push(
|
||||
{ x: startXPos, y: startYPos },
|
||||
{ x: startXPos + rectWidth, y: startYPos },
|
||||
{ x: startXPos, y: startYPos + rectHeight },
|
||||
{ x: startXPos + rectWidth, y: startYPos + rectHeight },
|
||||
)
|
||||
} else {
|
||||
startXPos = minX + i * rectWidth
|
||||
startYPos = maxY - j * rectHeight - 0.01
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos + i * cell.padding
|
||||
}
|
||||
|
||||
if (j > 0) {
|
||||
startYPos = startYPos - j * cell.padding
|
||||
}
|
||||
|
||||
rectPoints.push(
|
||||
{ x: startXPos, y: startYPos },
|
||||
{ x: startXPos + rectWidth, y: startYPos },
|
||||
{ x: startXPos, y: startYPos - rectHeight },
|
||||
{ x: startXPos + rectWidth, y: startYPos - rectHeight },
|
||||
)
|
||||
|
||||
startYPos = startYPos - rectHeight //밑에서 위로 올라가는거라 마이너스 처리
|
||||
}
|
||||
} else if (cell.referenceDirection === 'right') {
|
||||
if (cell.wallDirection === 'top') {
|
||||
startXPos = maxX - i * rectWidth - 0.01
|
||||
startYPos = minY + j * rectHeight + 0.01
|
||||
|
||||
if (j > 0) {
|
||||
startYPos = startYPos + j * cell.padding //위에서 밑으로라 +
|
||||
}
|
||||
|
||||
rectPoints.push(
|
||||
{ x: startXPos, y: startYPos },
|
||||
{ x: startXPos - rectWidth, y: startYPos },
|
||||
{ x: startXPos, y: startYPos + rectHeight },
|
||||
{ x: startXPos - rectWidth, y: startYPos + rectHeight },
|
||||
)
|
||||
} else {
|
||||
startXPos = maxX - i * rectWidth - 0.01
|
||||
startYPos = maxY - j * rectHeight - 0.01
|
||||
|
||||
if (j > 0) {
|
||||
startYPos = startYPos - j * cell.padding
|
||||
}
|
||||
rectPoints.push(
|
||||
{ x: startXPos, y: startYPos },
|
||||
{ x: startXPos - rectWidth, y: startYPos },
|
||||
{ x: startXPos, y: startYPos - rectHeight },
|
||||
{ x: startXPos - rectWidth, y: startYPos - rectHeight },
|
||||
)
|
||||
startYPos = startYPos - rectHeight //밑에서 위로 올라가는거라 마이너스 처리
|
||||
}
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos - i * cell.padding //옆으로 패딩
|
||||
}
|
||||
startXPos = startXPos - rectWidth // 우측에서 -> 좌측으로 그려짐
|
||||
}
|
||||
} else {
|
||||
// centerWidth = 0 //나중에 중간 정렬 이면 어쩌구 함수 만들어서 넣음
|
||||
if (['left', 'right'].includes(cell.wallDirection)) {
|
||||
centerWidth = 0
|
||||
} else if (['top', 'bottom'].includes(cell.wallDirection)) {
|
||||
centerHeight = 0
|
||||
}
|
||||
|
||||
if (cell.wallDirection === 'left') {
|
||||
startXPos = minX + i * rectWidth + centerWidth
|
||||
startYPos = minY + j * rectHeight + centerHeight
|
||||
if (i > 0) {
|
||||
startXPos = startXPos + i * cell.padding
|
||||
}
|
||||
if (j > 0 && j < rows) {
|
||||
startYPos = startYPos + j * cell.padding
|
||||
}
|
||||
} else if (cell.wallDirection === 'right') {
|
||||
startXPos = maxX - (1 + i) * rectWidth - 0.01 - centerWidth
|
||||
startYPos = minY + j * rectHeight + 0.01 + centerHeight
|
||||
if (i > 0) {
|
||||
startXPos = startXPos - i * cell.padding
|
||||
}
|
||||
if (j > 0 && j < rows) {
|
||||
startYPos = startYPos + j * cell.padding
|
||||
}
|
||||
} else if (cell.wallDirection === 'top') {
|
||||
startXPos = minX + i * rectWidth - 0.01 + centerWidth
|
||||
startYPos = minY + j * rectHeight + 0.01 + centerHeight
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos + i * cell.padding
|
||||
}
|
||||
if (j > 0 && j < rows) {
|
||||
startYPos = startYPos + j * cell.padding
|
||||
}
|
||||
} else if (cell.wallDirection === 'bottom') {
|
||||
startXPos = minX + i * rectWidth + 0.01 + centerWidth
|
||||
startYPos = maxY - (j + 1) * rectHeight - 0.01 - centerHeight
|
||||
|
||||
if (i > 0) {
|
||||
startXPos = startXPos + i * cell.padding
|
||||
}
|
||||
|
||||
if (j > 0 && j < rows) {
|
||||
startYPos = startYPos - j * cell.padding
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const allPointsInside = rectPoints.every((point) => this.inPolygonABType(point.x, point.y, points))
|
||||
|
||||
if (allPointsInside) {
|
||||
const text = new fabric.Text(`col ${i}, row ${j}`, {
|
||||
fontFamily: 'serif',
|
||||
fontSize: 10,
|
||||
fill: 'black',
|
||||
})
|
||||
|
||||
const rect = new fabric.Rect({
|
||||
left: startXPos,
|
||||
top: startYPos,
|
||||
// left: startXPos,
|
||||
// top: startYPos,
|
||||
width: rectWidth,
|
||||
height: rectHeight,
|
||||
fill: '#BFFD9F',
|
||||
@ -360,13 +526,19 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
|
||||
idx: idx,
|
||||
})
|
||||
|
||||
var group = new fabric.Group([rect, text], {
|
||||
left: startXPos,
|
||||
top: startYPos,
|
||||
})
|
||||
|
||||
idx++
|
||||
drawCellsArray.push(rect) //배열에 넣어서 반환한다
|
||||
this.canvas.add(rect)
|
||||
drawCellsArray.push(group) //배열에 넣어서 반환한다
|
||||
this.canvas.add(group)
|
||||
this.canvas?.renderAll()
|
||||
}
|
||||
}
|
||||
}
|
||||
this.canvas?.renderAll()
|
||||
|
||||
this.cells = drawCellsArray
|
||||
return drawCellsArray
|
||||
},
|
||||
@ -402,6 +574,25 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
|
||||
return intersects % 2 === 1
|
||||
},
|
||||
|
||||
inPolygonABType(x, y, polygon) {
|
||||
let inside = false
|
||||
let n = polygon.length
|
||||
|
||||
for (let i = 0, j = n - 1; i < n; j = i++) {
|
||||
let xi = polygon[i].x
|
||||
let yi = polygon[i].y
|
||||
let xj = polygon[j].x
|
||||
let yj = polygon[j].y
|
||||
|
||||
// console.log('xi : ', xi, 'yi : ', yi, 'xj : ', xj, 'yj : ', yj)
|
||||
|
||||
let intersect = yi > y !== yj > y && x < ((xj - xi) * (y - yi)) / (yj - yi) + xi
|
||||
if (intersect) inside = !inside
|
||||
}
|
||||
|
||||
return inside
|
||||
},
|
||||
|
||||
distanceFromEdge(point) {
|
||||
const vertices = this.getCurrentPoints()
|
||||
let minDistance = Infinity
|
||||
|
||||
@ -59,12 +59,14 @@ export function useMode() {
|
||||
const [selectedCellRoofArray, setSelectedCellRoofArray] = useState([])
|
||||
const [drewRoofCells, setDrewRoofCells] = useRecoilState(drewRoofCellsState)
|
||||
const [roofStyle, setRoofStyle] = useState(1) //기본 지붕 패턴
|
||||
const [templateCenterLine, setTemplateCenterLine] = useState([])
|
||||
|
||||
useEffect(() => {
|
||||
// 이벤트 리스너 추가
|
||||
if (!canvas) {
|
||||
return
|
||||
}
|
||||
// if (!canvas) {
|
||||
canvas?.setZoom(0.8)
|
||||
// return
|
||||
// }
|
||||
document.addEventListener('keydown', handleKeyDown)
|
||||
|
||||
// 컴포넌트가 언마운트될 때 이벤트 리스너 제거
|
||||
@ -1796,7 +1798,7 @@ export function useMode() {
|
||||
let bigRoofPolygon = []
|
||||
let middleRoofPolygon = []
|
||||
let smallRoofPolygon = []
|
||||
|
||||
let templateCenterLine = [] //추후 셀 입력시 상하좌우를 센터선 기준으로 판단하기 위함
|
||||
if (prevHighIndex === 1) {
|
||||
if (horizontalDirection === 'left') {
|
||||
//배열 순서대로 뒤에꺼를 찾아서 계산한다
|
||||
@ -1843,6 +1845,8 @@ export function useMode() {
|
||||
secondVertCenterLine = new QLine([secondVertCenterPoint, middleSubLine.y1, secondVertCenterPoint, middleSubLine.y2 - edge], centerLineOpt)
|
||||
canvas.add(secondVertCenterLine)
|
||||
outLines.push(secondVertCenterLine)
|
||||
templateCenterLine.push(vertCenterLine)
|
||||
templateCenterLine.push(secondVertCenterLine)
|
||||
|
||||
//작은 지붕쪽 너비 길이를 구한는 로직
|
||||
let secondHoriCenterLength = (Math.abs(lastLine.get('x1') - lastLine.get('x2')) + Math.abs(lastLine.get('y1') - lastLine.get('y2'))) / 2
|
||||
@ -2004,6 +2008,9 @@ export function useMode() {
|
||||
)
|
||||
canvas.add(secondHoriCenterLine)
|
||||
|
||||
templateCenterLine.push(vertCenterLine)
|
||||
templateCenterLine.push(secondVertCenterLine)
|
||||
|
||||
//일반라인 외각선 그리기
|
||||
normalIndexArray.forEach((index) => {
|
||||
const line = lines[index]
|
||||
@ -2144,6 +2151,9 @@ export function useMode() {
|
||||
canvas.add(secondVertCenterLine)
|
||||
outLines.push(secondVertCenterLine)
|
||||
|
||||
templateCenterLine.push(vertCenterLine)
|
||||
templateCenterLine.push(secondVertCenterLine)
|
||||
|
||||
//작은 지붕쪽 너비 길이를 구한는 로직
|
||||
let secondHoriCenterLength = (Math.abs(lastLine.get('x1') - lastLine.get('x2')) + Math.abs(lastLine.get('y1') - lastLine.get('y2'))) / 2
|
||||
let secondHoriCenterPoint = (secondVertCenterLine.y1 + secondVertCenterLine.y2) / 2
|
||||
@ -2285,6 +2295,10 @@ export function useMode() {
|
||||
|
||||
canvas.add(secondVertCenterLine)
|
||||
outLines.push(secondVertCenterLine)
|
||||
|
||||
templateCenterLine.push(vertCenterLine)
|
||||
templateCenterLine.push(secondVertCenterLine)
|
||||
|
||||
//작은 지붕쪽 너비 길이를 구한는 로직
|
||||
let secondHoriCenterLength = (Math.abs(lastLine.get('x1') - lastLine.get('x2')) + Math.abs(lastLine.get('y1') - lastLine.get('y2'))) / 2
|
||||
let secondHoriCenterPoint = (secondVertCenterLine.y1 + secondVertCenterLine.y2) / 2
|
||||
@ -2380,7 +2394,7 @@ export function useMode() {
|
||||
roofPatternPolygonArray.push(middleRoofPolygon) //중간라인 폴리곤
|
||||
roofPatternPolygonArray.push(smallRoofPolygon) //작은지붕폴리곤
|
||||
setRoofPolygonPattern({ roofPatternPolygonArray, lines }) //모든 행을 저장
|
||||
|
||||
setTemplateCenterLine(templateCenterLine) //A,B 템플릿의 센터 라인을 저장
|
||||
canvas?.renderAll()
|
||||
}
|
||||
|
||||
@ -3129,6 +3143,8 @@ export function useMode() {
|
||||
const middleRoofPolygon = []
|
||||
const smallRoofPolygon = []
|
||||
|
||||
const templateCenterLine = []
|
||||
|
||||
rerangeOdd.forEach((line, index) => {
|
||||
const centeredPoint = getCenterPoint(line.y1, line.y2)
|
||||
let points1 = []
|
||||
@ -3285,6 +3301,9 @@ export function useMode() {
|
||||
]
|
||||
subLines.forEach((sLine, index) => {
|
||||
const subLine = new QLine(sLine, qlineOpt)
|
||||
if (index === 1) {
|
||||
templateCenterLine.push(subLine)
|
||||
}
|
||||
canvas.add(subLine)
|
||||
})
|
||||
centralSubDashLinePoint.x1 = getCenterPoint(line.x1, line.x2 + edge)
|
||||
@ -3298,6 +3317,9 @@ export function useMode() {
|
||||
]
|
||||
subLines.forEach((sLine, index) => {
|
||||
const subLine = new QLine(sLine, qlineOpt)
|
||||
if (index === 1) {
|
||||
templateCenterLine.push(subLine)
|
||||
}
|
||||
canvas.add(subLine)
|
||||
})
|
||||
centralSubDashLinePoint.x1 = getCenterPoint(line.x1, line.x2 + edge)
|
||||
@ -3315,6 +3337,9 @@ export function useMode() {
|
||||
]
|
||||
subLines.forEach((sLine, index) => {
|
||||
const subLine = new QLine(sLine, qlineOpt)
|
||||
if (index === 0) {
|
||||
templateCenterLine.push(subLine)
|
||||
}
|
||||
canvas.add(subLine)
|
||||
})
|
||||
centralSubDashLinePoint.x1 = getCenterPoint(line.x1 - edge, line.x2)
|
||||
@ -3344,8 +3369,12 @@ export function useMode() {
|
||||
]
|
||||
subLines.forEach((sLine, index) => {
|
||||
const subLine = new QLine(sLine, qlineOpt)
|
||||
if (index === 0) {
|
||||
templateCenterLine.push(subLine)
|
||||
}
|
||||
canvas.add(subLine)
|
||||
})
|
||||
|
||||
centralSubDashLinePoint.x1 = getCenterPoint(line.x1 - edge, line.x2)
|
||||
centralSubDashLinePoint.x2 = getCenterPoint(line.x1 - edge, line.x2)
|
||||
centralSubDashLinePoint.y1 = line.y1 - eaves
|
||||
@ -3371,6 +3400,7 @@ export function useMode() {
|
||||
qlineOptDash,
|
||||
)
|
||||
canvas.add(centralSubDashLine)
|
||||
templateCenterLine.push(centralLine)
|
||||
|
||||
if (polygon.shape === 1) {
|
||||
bigRoofPolygon[3] = { x: centralLine.x1, y: centralLine.y1 }
|
||||
@ -3398,6 +3428,7 @@ export function useMode() {
|
||||
roofPatternPolygonArray.push(middleRoofPolygon)
|
||||
roofPatternPolygonArray.push(smallRoofPolygon)
|
||||
setRoofPolygonPattern({ roofPatternPolygonArray, lines: polygon.lines })
|
||||
setTemplateCenterLine(templateCenterLine)
|
||||
// }
|
||||
|
||||
canvas?.renderAll()
|
||||
@ -3646,6 +3677,8 @@ export function useMode() {
|
||||
// 외각선을 안쪽으로 그려 가대선을 그린다.
|
||||
polygons.forEach((polygon, index) => {
|
||||
const trestlePolygon = handleOuterlinesTest(polygon, -12)
|
||||
let referenceDirection = 'none' //상단 기준 값
|
||||
let parallelPoint = -1
|
||||
trestlePolygon.setViewLengthText(false) //얘는 set으로 안먹는다...
|
||||
trestlePolygon.set({
|
||||
stroke: 'red',
|
||||
@ -3661,6 +3694,62 @@ export function useMode() {
|
||||
name: 'trestlePolygon',
|
||||
})
|
||||
|
||||
if (polygon.points.length > 4) {
|
||||
//4각 이상일때만 한다
|
||||
const concave = findConcavePointIndices(polygon.points) //오목한 부분기준으로 시작점을 찾으려 계산
|
||||
parallelPoint = parseInt(concave.concavePointIndices[0] + 3) % polygon.points.length //시작점을 찾기 위해 적용
|
||||
|
||||
if (templateType === 2) {
|
||||
//셀이 그려져야할 기준 방향
|
||||
//A타입
|
||||
if (parallelPoint === 0 || parallelPoint === 5) {
|
||||
referenceDirection = 'top'
|
||||
} else {
|
||||
referenceDirection = 'bottom'
|
||||
}
|
||||
} else if (templateType === 3) {
|
||||
//B타입
|
||||
if (parallelPoint === 0 || parallelPoint === 1) {
|
||||
referenceDirection = 'left'
|
||||
} else {
|
||||
referenceDirection = 'right'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//셀이 생성될 지붕의 흐름방향을 정함
|
||||
templateCenterLine.some((centerLine) => {
|
||||
if (templateType === 2) {
|
||||
trestlePolygon.set({
|
||||
referenceDirection: referenceDirection,
|
||||
startIndex: parallelPoint,
|
||||
}) //기준면 방향
|
||||
trestlePolygon.points.forEach((trestleLine, index) => {
|
||||
if (trestleLine.x === centerLine.x1 - 12) {
|
||||
trestlePolygon.set({ wallDirection: 'left' })
|
||||
return true
|
||||
} else if (trestleLine.x === centerLine.x1 + 12) {
|
||||
trestlePolygon.set({ wallDirection: 'right' })
|
||||
return true
|
||||
}
|
||||
})
|
||||
} else if (templateType === 3) {
|
||||
trestlePolygon.set({
|
||||
referenceDirection: referenceDirection,
|
||||
startIndex: parallelPoint,
|
||||
}) //기준면 방향
|
||||
trestlePolygon.points.forEach((trestleLine, index) => {
|
||||
if (trestleLine.y === centerLine.y1 - 12) {
|
||||
trestlePolygon.set({ wallDirection: 'top' })
|
||||
return true
|
||||
} else if (trestleLine.y === centerLine.y1 + 12) {
|
||||
trestlePolygon.set({ wallDirection: 'bottom' })
|
||||
return true
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
/**
|
||||
* 가대 선택 이벤트
|
||||
*/
|
||||
@ -3709,25 +3798,16 @@ export function useMode() {
|
||||
}
|
||||
|
||||
selectedCellRoofArray.forEach((polygon, index) => {
|
||||
let parallelPoint = -1 //오목한 부분의 반대 꼭지점 //없는 애들도 있어서 -1
|
||||
const startPoint = {} //도형의 시작점을 찾기 위해
|
||||
//오목한 부분의 반대 꼭지점 //없는 애들도 있어서 -1
|
||||
|
||||
if (polygon.lines.length > 4) {
|
||||
const concave = findConcavePointIndices(polygon.points) //오목한 부분기준으로 시작점을 찾으려 계산
|
||||
parallelPoint = parseInt(concave.concavePointIndices[0] + 3) % polygon.points.length //시작점을 찾기 위해 적용
|
||||
startPoint.x = polygon.points[parallelPoint].x
|
||||
startPoint.y = polygon.points[parallelPoint].y
|
||||
}
|
||||
|
||||
const drawCells = polygon.fillCellABTemplate({
|
||||
const drawCells = polygon.fillCellABType({
|
||||
width: cellSize.width,
|
||||
height: cellSize.height,
|
||||
padding: 10,
|
||||
parallelPoint: parallelPoint,
|
||||
startX: startPoint.x,
|
||||
startY: startPoint.y,
|
||||
wallDirection: polygon.wallDirection,
|
||||
referenceDirection: polygon.referenceDirection,
|
||||
startIndex: polygon.startIndex,
|
||||
})
|
||||
// const drawCells = polygon.fillCell({ width: cellSize.width, height: cellSize.height, padding: 10 })
|
||||
drawCellsArray.push({ roofIndex: polygon.customIndex, drawCells: drawCells })
|
||||
})
|
||||
|
||||
|
||||
43
yarn.lock
43
yarn.lock
@ -1351,6 +1351,42 @@
|
||||
resolved "https://registry.yarnpkg.com/@prisma/client/-/client-5.18.0.tgz#526e4281a448f214c0ff81d65c39243608c98294"
|
||||
integrity sha512-BWivkLh+af1kqC89zCJYkHsRcyWsM8/JHpsDMM76DjP3ZdEquJhXa4IeX+HkWPnwJ5FanxEJFZZDTWiDs/Kvyw==
|
||||
|
||||
"@prisma/debug@5.18.0":
|
||||
version "5.18.0"
|
||||
resolved "https://registry.yarnpkg.com/@prisma/debug/-/debug-5.18.0.tgz#527799e044d2903a35945e61ac2d8916e4b61ead"
|
||||
integrity sha512-f+ZvpTLidSo3LMJxQPVgAxdAjzv5OpzAo/eF8qZqbwvgi2F5cTOI9XCpdRzJYA0iGfajjwjOKKrVq64vkxEfUw==
|
||||
|
||||
"@prisma/engines-version@5.18.0-25.4c784e32044a8a016d99474bd02a3b6123742169":
|
||||
version "5.18.0-25.4c784e32044a8a016d99474bd02a3b6123742169"
|
||||
resolved "https://registry.yarnpkg.com/@prisma/engines-version/-/engines-version-5.18.0-25.4c784e32044a8a016d99474bd02a3b6123742169.tgz#203426ebf4ec4e1acce7da4a59ec8f0df92b29e7"
|
||||
integrity sha512-a/+LpJj8vYU3nmtkg+N3X51ddbt35yYrRe8wqHTJtYQt7l1f8kjIBcCs6sHJvodW/EK5XGvboOiwm47fmNrbgg==
|
||||
|
||||
"@prisma/engines@5.18.0":
|
||||
version "5.18.0"
|
||||
resolved "https://registry.yarnpkg.com/@prisma/engines/-/engines-5.18.0.tgz#26ea46e26498be622407cf95663d7fb4c39c895b"
|
||||
integrity sha512-ofmpGLeJ2q2P0wa/XaEgTnX/IsLnvSp/gZts0zjgLNdBhfuj2lowOOPmDcfKljLQUXMvAek3lw5T01kHmCG8rg==
|
||||
dependencies:
|
||||
"@prisma/debug" "5.18.0"
|
||||
"@prisma/engines-version" "5.18.0-25.4c784e32044a8a016d99474bd02a3b6123742169"
|
||||
"@prisma/fetch-engine" "5.18.0"
|
||||
"@prisma/get-platform" "5.18.0"
|
||||
|
||||
"@prisma/fetch-engine@5.18.0":
|
||||
version "5.18.0"
|
||||
resolved "https://registry.yarnpkg.com/@prisma/fetch-engine/-/fetch-engine-5.18.0.tgz#5b343e2b36b27e2713901ddd032ddd6932b3d55f"
|
||||
integrity sha512-I/3u0x2n31rGaAuBRx2YK4eB7R/1zCuayo2DGwSpGyrJWsZesrV7QVw7ND0/Suxeo/vLkJ5OwuBqHoCxvTHpOg==
|
||||
dependencies:
|
||||
"@prisma/debug" "5.18.0"
|
||||
"@prisma/engines-version" "5.18.0-25.4c784e32044a8a016d99474bd02a3b6123742169"
|
||||
"@prisma/get-platform" "5.18.0"
|
||||
|
||||
"@prisma/get-platform@5.18.0":
|
||||
version "5.18.0"
|
||||
resolved "https://registry.yarnpkg.com/@prisma/get-platform/-/get-platform-5.18.0.tgz#0dc4c82fe9a4971f4519a57cb2dd69d8e0df4b71"
|
||||
integrity sha512-Tk+m7+uhqcKDgnMnFN0lRiH7Ewea0OEsZZs9pqXa7i3+7svS3FSCqDBCaM9x5fmhhkufiG0BtunJVDka+46DlA==
|
||||
dependencies:
|
||||
"@prisma/debug" "5.18.0"
|
||||
|
||||
"@react-aria/breadcrumbs@3.5.13":
|
||||
version "3.5.13"
|
||||
resolved "https://registry.npmjs.org/@react-aria/breadcrumbs/-/breadcrumbs-3.5.13.tgz"
|
||||
@ -2389,7 +2425,7 @@
|
||||
resolved "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.7.tgz"
|
||||
integrity sha512-8wTvZawATi/lsmNu10/j2hk1KEP0IvjubqPE3cu1Xz7xfXXt5oCq3SNUz4fMIP4XGF9Ky+Ue2tBA3hcS7LSBlA==
|
||||
|
||||
"@types/node@>=18":
|
||||
"@types/node@*", "@types/node@>=18":
|
||||
version "22.1.0"
|
||||
resolved "https://registry.yarnpkg.com/@types/node/-/node-22.1.0.tgz#6d6adc648b5e03f0e83c78dc788c2b037d0ad94b"
|
||||
integrity sha512-AOmuRF0R2/5j1knA3c6G3HOk523Ga+l+ZXltX8SF1+5oqcXijjfTd8fY3XRZqSihEu9XhtQnKYLmkFaoxgsJHw==
|
||||
@ -4061,6 +4097,11 @@ safe-buffer@^5.0.1, safe-buffer@~5.2.0:
|
||||
resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz"
|
||||
integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==
|
||||
|
||||
safe-buffer@~5.1.1:
|
||||
version "5.1.2"
|
||||
resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
|
||||
integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==
|
||||
|
||||
"safer-buffer@>= 2.1.2 < 3.0.0":
|
||||
version "2.1.2"
|
||||
resolved "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user