qcast3/qcast-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dev #760

Merged
ysCha merged 3 commits from dev into prd-deploy 2026-04-08 12:38:54 +09:00
Conversation 0 Commits 3 Files Changed 3 +144 -83
3 changed files with 144 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.env.development
View File

@ -13,8 +13,8 @@ SESSION_SECRET="i3iHH1yp2/2SpQSIySQ4bpyc4g0D+zCF9FAn5xUG0+Y="
NEXT_PUBLIC_CONVERTER_DWG_API_URL="https://v2.convertapi.com/convert/dwg/to/png?Secret=secret_a0FLEK6M2oTpXInK"
NEXT_PUBLIC_CONVERTER_DXF_API_URL="https://v2.convertapi.com/convert/dxf/to/png?Secret=secret_a0FLEK6M2oTpXInK"
NEXT_PUBLIC_Q_ORDER_AUTO_LOGIN_URL="http://q-order-stg.q-cells.jp:8120/eos/login/autoLogin"
NEXT_PUBLIC_Q_MUSUBI_AUTO_LOGIN_URL="http://q-musubi-stg.q-cells.jp:8120/qm/login/autoLogin"
NEXT_PUBLIC_Q_ORDER_AUTO_LOGIN_URL="http://q-order-dev.q-cells.jp:8120/eos/login/autoLogin"
NEXT_PUBLIC_Q_MUSUBI_AUTO_LOGIN_URL="http://q-musubi-dev.q-cells.jp:8120/qm/login/autoLogin"
# 테스트용
# AWS_REGION="ap-northeast-2"

116
src/hooks/useMode.js
View File

@ -1718,14 +1718,22 @@ export function useMode() {
for (let i = 0; i < n; i++) {
const next = (i + 1) % n
// 인접한 두 edge가 같은 방향이면 겹치는 선
// 인접한 두 edge가 같은 방향이면 두 edge 를 하나로 합칠 수 있다.
// 이 때 제거해야 하는 정점은 두 edge 사이의 "junction" 정점 = vertex[next].
// (vertex[i] 는 edge[i-1] 의 끝이자 edge[i] 의 시작으로, 실제 코너일 수 있으므로 제거하면 안 됨.)
if (isSameDirection(edges[i].angle, edges[next].angle)) {
// 짧은 쪽을 제거 대상으로 표시
if (edges[i].length <= edges[next].length) {
removeIndices.add(i)
} else {
removeIndices.add(next)
}
removeIndices.add(next)
}
}
// 절대 길이가 너무 짧은 edge 는 inset offset (~20) 대비 불안정하므로 제거.
// edge[i] 가 tiny 이면 시작 정점 vertex[i] 를 제거해 앞쪽 edge 와 병합한다.
// 이렇게 하면 남는 cleaned edge 의 line 매핑(cleanedLines[k]=lines[kept[k]]) 이
// edge[i+1] (실제 긴 edge) 의 line 을 쓰게 되므로 offset 계산이 안정해진다.
const TINY_EDGE_THRESHOLD = 30
for (let i = 0; i < n; i++) {
if (edges[i].length < TINY_EDGE_THRESHOLD) {
removeIndices.add(i)
}
}
@ -1747,6 +1755,25 @@ export function useMode() {
}
function createMarginPolygon(polygon, lines, arcSegments = 0, bevelJoin = false) {
// 폴리곤의 winding 방향 보정: inwardEdgeNormal 이 CW (signedArea > 0) 가정이므로
// CCW 폴리곤은 vertex/lines 순서를 뒤집어 다시 createRoofPolygon 한 뒤 진행한다.
const rawSignedArea = polygon.edges.reduce(
(sum, edge) => sum + (edge.vertex1.x * edge.vertex2.y - edge.vertex2.x * edge.vertex1.y),
0,
)
if (rawSignedArea < 0) {
const reversedVertices = [...polygon.vertices].reverse()
const reversedLines = []
const n = lines.length
// lines[i] 는 edge i (vertex[i] → vertex[i+1]) 에 해당. reverse 후의 edge j 는
// 원본 edge (n - 1 - j) 와 같은 선분이므로 lines 배열도 동일 매핑으로 재정렬.
for (let j = 0; j < n; j++) {
reversedLines.push(lines[(n - 1 - j) % n])
}
polygon = createRoofPolygon(reversedVertices)
lines = reversedLines
}
const offsetEdges = []
polygon.edges.forEach((edge, i) => {
@ -1756,37 +1783,16 @@ export function useMode() {
offsetEdges.push(createOffsetEdge(edge, dx, dy))
})
// 폴리곤의 감김 방향(signed area)을 구한다
const signedArea = bevelJoin
? polygon.edges.reduce((sum, edge) => sum + (edge.vertex1.x * edge.vertex2.y - edge.vertex2.x * edge.vertex1.y), 0)
: 0
const vertices = []
offsetEdges.forEach((thisEdge, i) => {
const prevEdge = offsetEdges[(i + offsetEdges.length - 1) % offsetEdges.length]
const vertex = edgesIntersection(prevEdge, thisEdge)
if (vertex) {
if (!vertex.isIntersectionOutside || !bevelJoin) {
vertices.push({ x: vertex.x, y: vertex.y })
} else {
// 꼭짓점의 볼록/오목 판별 (cross product와 signed area 비교)
const origPrev = polygon.edges[(i + polygon.edges.length - 1) % polygon.edges.length]
const origThis = polygon.edges[i]
const cross =
(origPrev.vertex2.x - origPrev.vertex1.x) * (origThis.vertex2.y - origThis.vertex1.y) -
(origPrev.vertex2.y - origPrev.vertex1.y) * (origThis.vertex2.x - origThis.vertex1.x)
const isConvex = cross * signedArea > 0
if (isConvex) {
// 볼록 꼭짓점: bevel 적용 (offset edge 끝점 사용)
vertices.push({ x: prevEdge.vertex2.x, y: prevEdge.vertex2.y })
vertices.push({ x: thisEdge.vertex1.x, y: thisEdge.vertex1.y })
} else {
// 오목 꼭짓점: 교차점 사용 (90도 유지)
vertices.push({ x: vertex.x, y: vertex.y })
}
}
// 볼록/오목 관계없이 두 offset edge 의 무한 직선 교점이 올바른 inset 꼭지점.
// isIntersectionOutside 는 offset "선분" 기준 flag 일 뿐이고, self-intersection(스파이크)
// 은 이후 cleanSelfIntersectingPolygon 과 clipOffsetToOriginal 에서 처리한다.
vertices.push({ x: vertex.x, y: vertex.y })
}
})
@ -1803,6 +1809,23 @@ export function useMode() {
* @returns {{vertices, edges: *[], minX: *, minY: *, maxX: *, maxY: *}}
*/
function createPaddingPolygon(polygon, lines, arcSegments = 0, bevelJoin = false) {
// 폴리곤의 winding 방향 보정: inwardEdgeNormal 이 CW (signedArea > 0) 가정이므로
// CCW 폴리곤은 vertex/lines 순서를 뒤집어 다시 createRoofPolygon 한 뒤 진행한다.
const rawSignedArea = polygon.edges.reduce(
(sum, edge) => sum + (edge.vertex1.x * edge.vertex2.y - edge.vertex2.x * edge.vertex1.y),
0,
)
if (rawSignedArea < 0) {
const reversedVertices = [...polygon.vertices].reverse()
const reversedLines = []
const n = lines.length
for (let j = 0; j < n; j++) {
reversedLines.push(lines[(n - 1 - j) % n])
}
polygon = createRoofPolygon(reversedVertices)
lines = reversedLines
}
const offsetEdges = []
polygon.edges.forEach((edge, i) => {
@ -1813,37 +1836,16 @@ export function useMode() {
offsetEdges.push(createOffsetEdge(edge, dx, dy))
})
// 폴리곤의 감김 방향(signed area)을 구한다
const signedArea = bevelJoin
? polygon.edges.reduce((sum, edge) => sum + (edge.vertex1.x * edge.vertex2.y - edge.vertex2.x * edge.vertex1.y), 0)
: 0
const vertices = []
offsetEdges.forEach((thisEdge, i) => {
const prevEdge = offsetEdges[(i + offsetEdges.length - 1) % offsetEdges.length]
const vertex = edgesIntersection(prevEdge, thisEdge)
if (vertex) {
if (!vertex.isIntersectionOutside || !bevelJoin) {
vertices.push({ x: vertex.x, y: vertex.y })
} else {
// 꼭짓점의 볼록/오목 판별 (cross product와 signed area 비교)
const origPrev = polygon.edges[(i + polygon.edges.length - 1) % polygon.edges.length]
const origThis = polygon.edges[i]
const cross =
(origPrev.vertex2.x - origPrev.vertex1.x) * (origThis.vertex2.y - origThis.vertex1.y) -
(origPrev.vertex2.y - origPrev.vertex1.y) * (origThis.vertex2.x - origThis.vertex1.x)
const isConvex = cross * signedArea > 0
if (isConvex) {
// 볼록 꼭짓점: bevel 적용 (offset edge 끝점 사용)
vertices.push({ x: prevEdge.vertex2.x, y: prevEdge.vertex2.y })
vertices.push({ x: thisEdge.vertex1.x, y: thisEdge.vertex1.y })
} else {
// 오목 꼭짓점: 교차점 사용 (90도 유지)
vertices.push({ x: vertex.x, y: vertex.y })
}
}
// 볼록/오목 관계없이 두 offset edge 의 무한 직선 교점이 올바른 inset 꼭지점.
// isIntersectionOutside 는 offset "선분" 기준 flag 일 뿐이고, self-intersection(스파이크)
// 은 이후 cleanSelfIntersectingPolygon 과 clipOffsetToOriginal 에서 처리한다.
vertices.push({ x: vertex.x, y: vertex.y })
}
})

107
src/util/qpolygon-utils.js
View File

@ -256,8 +256,11 @@ function createPaddingPolygon(polygon, offset, arcSegments = 0) {
* @returns {Array} 정리된 점 배열
*/
/**
* offset 폴리곤의 꼭짓점 중 원본 폴리곤 바깥에 나간 점을
* 원본 폴리곤 경계 위의 가장 가까운 점으로 투영한다.
* offset 폴리곤을 원본 폴리곤 경계 안으로 클리핑한다.
* 삼각형/예각 꼭짓점 등에서 bevel 때문에 offset 꼭짓점이 원본 바깥으로
* 튀어나가는 경우, 점별 투영이 아니라 turf.intersect 로 면 단위 클리핑을 수행한다.
* 점별 투영은 여러 점이 원본 바깥으로 나가면 각 점이 제각각 가까운 변으로
* 스냅되어 폴리곤이 직사각형처럼 찌그러지는 문제가 있었음.
* @param {Array} offsetVertices - offset된 점 배열 [{x, y}, ...]
* @param {Array} originalVertices - 원본 폴리곤 점 배열 [{x, y}, ...]
* @returns {Array} 클리핑된 점 배열
@ -266,14 +269,15 @@ export function clipOffsetToOriginal(offsetVertices, originalVertices) {
if (!offsetVertices || offsetVertices.length < 3) return offsetVertices
if (!originalVertices || originalVertices.length < 3) return offsetVertices
// 점이 폴리곤 내부에 있는지 판단 (ray casting)
function pointInPolygon(point, polygon) {
// 점이 폴리곤 내부(또는 경계)에 있는지 판단 (ray casting)
const _pointInPolygon = (point, polygon) => {
let inside = false
for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
const xi = polygon[i].x, yi = polygon[i].y
const xj = polygon[j].x, yj = polygon[j].y
if (((yi > point.y) !== (yj > point.y)) &&
(point.x < (xj - xi) * (point.y - yi) / (yj - yi) + xi)) {
const xi = polygon[i].x,
yi = polygon[i].y
const xj = polygon[j].x,
yj = polygon[j].y
if (yi > point.y !== yj > point.y && point.x < ((xj - xi) * (point.y - yi)) / (yj - yi) + xi) {
inside = !inside
}
}
@ -281,7 +285,7 @@ export function clipOffsetToOriginal(offsetVertices, originalVertices) {
}
// 점을 선분 위의 가장 가까운 점으로 투영
function projectOnSegment(p, a, b) {
const _projectOnSegment = (p, a, b) => {
const dx = b.x - a.x
const dy = b.y - a.y
const lenSq = dx * dx + dy * dy
@ -291,24 +295,79 @@ export function clipOffsetToOriginal(offsetVertices, originalVertices) {
return { x: a.x + t * dx, y: a.y + t * dy }
}
return offsetVertices.map((p) => {
if (pointInPolygon(p, originalVertices)) return p
// 최종 결과 정점을 원본 폴리곤 경계 안으로 스냅하는 post-process.
// 부동소수점 누적/tiny edge 때문에 아주 미세하게 바깥에 있는 점만 복원한다.
const _snapToBoundary = (verts) => {
return verts.map((p) => {
if (_pointInPolygon(p, originalVertices)) return p
let minDist = Infinity
let nearest = p
for (let i = 0; i < originalVertices.length; i++) {
const a = originalVertices[i]
const b = originalVertices[(i + 1) % originalVertices.length]
const proj = _projectOnSegment(p, a, b)
const dd = (proj.x - p.x) * (proj.x - p.x) + (proj.y - p.y) * (proj.y - p.y)
if (dd < minDist) {
minDist = dd
nearest = proj
}
}
return nearest
})
}
// 바깥에 있으면 원본 폴리곤의 가장 가까운 변 위의 점으로 이동
let minDist = Infinity
let nearest = p
for (let i = 0; i < originalVertices.length; i++) {
const a = originalVertices[i]
const b = originalVertices[(i + 1) % originalVertices.length]
const proj = projectOnSegment(p, a, b)
const dist = (proj.x - p.x) * (proj.x - p.x) + (proj.y - p.y) * (proj.y - p.y)
if (dist < minDist) {
minDist = dist
nearest = proj
try {
const offsetCoords = offsetVertices.map((p) => [p.x, p.y])
offsetCoords.push([offsetVertices[0].x, offsetVertices[0].y])
const origCoords = originalVertices.map((p) => [p.x, p.y])
origCoords.push([originalVertices[0].x, originalVertices[0].y])
// 자기교차가 있으면 intersect 가 실패하므로 먼저 unkink
let offsetPoly = turf.polygon([offsetCoords])
const kinked = turf.kinks(offsetPoly)
if (kinked.features.length > 0) {
const unkinked = turf.unkinkPolygon(offsetPoly)
if (unkinked.features.length > 0) {
offsetPoly = unkinked.features.reduce((max, f) => (turf.area(f) > turf.area(max) ? f : max))
}
}
return nearest
})
const origPoly = turf.polygon([origCoords])
const clipped = turf.intersect(turf.featureCollection([offsetPoly, origPoly]))
if (clipped) {
// MultiPolygon 인 경우 가장 큰 폴리곤 선택
let coords
if (clipped.geometry.type === 'MultiPolygon') {
let maxArea = -Infinity
let bestRing = null
clipped.geometry.coordinates.forEach((poly) => {
const ring = poly[0]
const feat = turf.polygon([ring])
const area = turf.area(feat)
if (area > maxArea) {
maxArea = area
bestRing = ring
}
})
coords = bestRing
} else {
coords = clipped.geometry.coordinates[0]
}
if (coords && coords.length > 0) {
const result = coords.slice(0, -1).map((c) => ({ x: c[0], y: c[1] }))
// 부동소수점 오차로 미세하게 경계 밖에 있는 점만 경계로 스냅
return _snapToBoundary(result)
}
}
} catch (e) {
console.warn('Failed to clip offset polygon to original:', e)
}
// turf 실패 fallback: 바깥으로 나간 점만 원본 경계로 스냅
return _snapToBoundary(offsetVertices)
}
export function cleanSelfIntersectingPolygon(vertices) {