6각형 polygon make 테스트

This commit is contained in:
yjnoh 2024-07-20 15:20:41 +09:00
parent 9e075deb91
commit e5de66bc94

View File

@ -1,13 +1,7 @@
import { useRef, useState } from 'react' import { useRef, useState } from 'react'
import QRect from '@/components/fabric/QRect' import QRect from '@/components/fabric/QRect'
import QPolygon from '@/components/fabric/QPolygon' import QPolygon from '@/components/fabric/QPolygon'
import { import { findTopTwoIndexesByDistance, getCenterPoint, getDirection, getStartIndex, rearrangeArray } from '@/util/canvas-util'
findTopTwoIndexesByDistance,
getCenterPoint,
getDirection,
getStartIndex,
rearrangeArray,
} from '@/util/canvas-util'
import { useRecoilState } from 'recoil' import { useRecoilState } from 'recoil'
import { fontSizeState, roofState, sortedPolygonArray, templatePolygonArrayState, wallState } from '@/store/canvasAtom' import { fontSizeState, roofState, sortedPolygonArray, templatePolygonArrayState, wallState } from '@/store/canvasAtom'
import { QLine } from '@/components/fabric/QLine' import { QLine } from '@/components/fabric/QLine'
@ -1171,7 +1165,6 @@ export function useMode() {
) )
canvas.add(horiCenterLine2) canvas.add(horiCenterLine2)
//작은 지붕쪽 높이 길이를 구하는 로직 //작은 지붕쪽 높이 길이를 구하는 로직
let secondVertCenterPoint = (lastLine.x1 + lastLine.x2) / 2 let secondVertCenterPoint = (lastLine.x1 + lastLine.x2) / 2
secondVertCenterLine = new QLine([secondVertCenterPoint, middleSubLine.y1, secondVertCenterPoint, middleSubLine.y2 - edge], centerLineOpt) secondVertCenterLine = new QLine([secondVertCenterPoint, middleSubLine.y1, secondVertCenterPoint, middleSubLine.y2 - edge], centerLineOpt)
@ -1257,11 +1250,31 @@ export function useMode() {
canvas.add(drawLastInLine2) canvas.add(drawLastInLine2)
outLines.push(drawLastInLine2) outLines.push(drawLastInLine2)
const bigPolygon = [ console.log('outLines', outLines)
{ x1: outLines[2].x1, y1: outLines[2].y1 },
const bigPolygonArray = [
{ x: outLines[2].x1, y: outLines[2].y1 },
{ x: outLines[5].x1, y: outLines[5].y1 },
{ x: outLines[0].x1, y: outLines[0].y1 },
{ x: outLines[0].x2, y: outLines[0].y2 },
{ x: outLines[11].x1, y: outLines[11].y1 },
{ x: outLines[1].x2, y: outLines[1].y2 },
] ]
// 점 배열을 사용하여 새로운 다각형 객체를 생성합니다.
const bigPolygon = new QPolygon(
bigPolygonArray,
{
stroke: 'black',
fill: 'red',
viewLengthText: true,
selectable: true,
fontSize: fontSize,
},
canvas,
)
canvas.add(bigPolygon)
} else { } else {
//아래쪽 길게 오른쪽 방향 //아래쪽 길게 오른쪽 방향
//배열 순서대로 뒤에꺼를 찾아서 계산한다 //배열 순서대로 뒤에꺼를 찾아서 계산한다