diff --git a/src/hooks/useMode.js b/src/hooks/useMode.js index a44b0407..ebcaa5c5 100644 --- a/src/hooks/useMode.js +++ b/src/hooks/useMode.js @@ -206,7 +206,8 @@ export function useMode() { points.current = [] historyPoints.current = [] - handleOuterlines() + // handleOuterlines() + handleOuterlinesTest() //외곽선 그리기 테스트 makePolygon() } @@ -355,6 +356,7 @@ export function useMode() { const makePolygon = (otherLines) => { // 캔버스에서 모든 라인 객체를 찾습니다. const lines = otherLines || historyLines.current + if (!otherLines) { //외각선 기준 const sortedIndex = getStartIndex(lines) @@ -373,21 +375,17 @@ export function useMode() { if (topIndex[1] === 5) { //1번 setShape(1) - console.log('shape :: ', 1) } } else if (topIndex[0] === 1) { //4번 if (topIndex[1] === 2) { - console.log('shape :: ', 4) setShape(4) } } else if (topIndex[0] === 0) { if (topIndex[1] === 1) { //2번 - console.log('shape :: ', 2) setShape(2) } else if (topIndex[1] === 5) { - console.log('shape :: ', 3) setShape(3) } } @@ -741,6 +739,66 @@ export function useMode() { makePolygon(newOuterlines) } + const handleOuterlinesTest = () => { + var offsetPoints = [] + let offset = -35.5 // == 100 - 29 + + const points = historyLines.current.map((line) => ({ + x: line.x1, + y: line.y1, + })) + + for (var i = 0; i < points.length; i++) { + var prev = points[(i - 1 + points.length) % points.length] + var current = points[i] + var next = points[(i + 1) % points.length] + + // 두 벡터 계산 (prev -> current, current -> next) + var vector1 = { x: current.x - prev.x, y: current.y - prev.y } + var vector2 = { x: next.x - current.x, y: next.y - current.y } + + // 벡터의 길이 계산 + var length1 = Math.sqrt(vector1.x * vector1.x + vector1.y * vector1.y) + var length2 = Math.sqrt(vector2.x * vector2.x + vector2.y * vector2.y) + + // 벡터를 단위 벡터로 정규화 + var unitVector1 = { x: vector1.x / length1, y: vector1.y / length1 } + var unitVector2 = { x: vector2.x / length2, y: vector2.y / length2 } + + // 법선 벡터 계산 (왼쪽 방향) + var normal1 = { x: -unitVector1.y, y: unitVector1.x } + var normal2 = { x: -unitVector2.y, y: unitVector2.x } + + // 법선 벡터 평균 계산 + var averageNormal = { + x: (normal1.x + normal2.x) / 2, + y: (normal1.y + normal2.y) / 2, + } + + // 평균 법선 벡터를 단위 벡터로 정규화 + var lengthNormal = Math.sqrt( + averageNormal.x * averageNormal.x + averageNormal.y * averageNormal.y, + ) + var unitNormal = { + x: averageNormal.x / lengthNormal, + y: averageNormal.y / lengthNormal, + } + + console.log('current', current) + console.log('unitNormal', unitNormal) + + // 오프셋 적용 + var offsetPoint = { + x1: current.x + unitNormal.x * offset, + y1: current.y + unitNormal.y * offset, + } + + offsetPoints.push(offsetPoint) + } + + makePolygon(offsetPoints) + } + return { mode, changeMode,