diff --git a/package.json b/package.json index 6fa1bdb..7fa13aa 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@baekryang/responsive-image-canvas", - "version": "1.5.2", + "version": "1.5.4", "publishConfig": { "registry": "https://git.bnovalab.com/api/packages/baekryang/npm/" }, diff --git a/src/editor/components/EditorCanvas.tsx b/src/editor/components/EditorCanvas.tsx index 0e2adf2..34c5bb1 100644 --- a/src/editor/components/EditorCanvas.tsx +++ b/src/editor/components/EditorCanvas.tsx @@ -147,7 +147,8 @@ export const EditorCanvas: React.FC = ({ for (let i = spriteEffectAreas.length - 1; i >= 0; i--) { const sa = spriteEffectAreas[i]; const dx = clickPoint.x - sa.position.x; - const dy = clickPoint.y - sa.position.y; + const aspect = rect.width / rect.height; + const dy = (clickPoint.y - sa.position.y) / aspect; const radius = sa.radius ?? 0.1; if (dx * dx + dy * dy <= radius * radius) { setDraggingSpriteAreaId(sa.id); diff --git a/src/engine/SpriteEffectManager.ts b/src/engine/SpriteEffectManager.ts index 8a27aab..8017402 100644 --- a/src/engine/SpriteEffectManager.ts +++ b/src/engine/SpriteEffectManager.ts @@ -16,9 +16,10 @@ export interface SpriteEffectTouchState { /** * 점이 원 안에 있는지 확인 */ -const isPointInCircle = (point: Point, center: Point, radius: number): boolean => { +const isPointInCircle = (point: Point, center: Point, radius: number, resolution?: { x: number; y: number }): boolean => { + const aspect = resolution ? resolution.x / resolution.y : 1; const dx = point.x - center.x; - const dy = point.y - center.y; + const dy = (point.y - center.y) / aspect; return dx * dx + dy * dy <= radius * radius; }; @@ -97,7 +98,7 @@ export class SpriteEffectManager { if (touchState.isDragging && touchState.position) { for (const area of effectAreas) { const radius = area.radius ?? 0.1; - if (isPointInCircle(touchState.position, area.position, radius)) { + if (isPointInCircle(touchState.position, area.position, radius, resolution)) { currentTouchingAreas.add(area.id); } }