그리드 흡착 내용 수정

This commit is contained in:
hyojun.choi 2025-02-25 13:04:43 +09:00
parent a7b11b374e
commit bcdb6a8d82

View File

@ -2,7 +2,7 @@ import { useRef } from 'react'
import { useRecoilValue, useSetRecoilState } from 'recoil'
import { canvasState, canvasZoomState, currentMenuState, textModeState } from '@/store/canvasAtom'
import { fabric } from 'fabric'
import { calculateDistance, calculateIntersection, distanceBetweenPoints, findClosestPoint } from '@/util/canvas-util'
import { calculateDistance, calculateDistancePoint, calculateIntersection, distanceBetweenPoints, findClosestPoint } from '@/util/canvas-util'
import { useAdsorptionPoint } from '@/hooks/useAdsorptionPoint'
import { useDotLineGrid } from '@/hooks/useDotLineGrid'
import { useTempGrid } from '@/hooks/useTempGrid'
@ -101,10 +101,31 @@ export function useEvent() {
if (dotLineGridSetting.LINE || canvas.getObjects().filter((obj) => ['lineGrid', 'tempGrid'].includes(obj.name)).length > 0) {
const closestLine = getClosestLineGrid(pointer)
if (closestLine) {
const distance = calculateDistance(pointer, closestLine)
const horizonLines = canvas.getObjects().filter((obj) => obj.name === 'lineGrid' && obj.direction === 'horizontal')
const verticalLines = canvas.getObjects().filter((obj) => obj.name === 'lineGrid' && obj.direction === 'vertical')
if (distance < adsorptionRange) {
const closestHorizontalLine = horizonLines.reduce((prev, curr) => {
const prevDistance = calculateDistance(pointer, prev)
const currDistance = calculateDistance(pointer, curr)
return prevDistance < currDistance ? prev : curr
})
const closestVerticalLine = verticalLines.reduce((prev, curr) => {
const prevDistance = calculateDistance(pointer, prev)
const currDistance = calculateDistance(pointer, curr)
return prevDistance < currDistance ? prev : curr
})
const closestIntersectionPoint = calculateIntersection(closestHorizontalLine, closestVerticalLine)
if (closestLine) {
const distanceClosestLine = calculateDistance(pointer, closestLine)
let distanceClosestPoint = Infinity
if (closestIntersectionPoint) {
distanceClosestPoint = calculateDistancePoint(pointer, closestIntersectionPoint)
}
if (distanceClosestLine < adsorptionRange) {
arrivalPoint =
closestLine.direction === 'vertical'
? { x: closestLine.x1, y: pointer.y }
@ -112,6 +133,10 @@ export function useEvent() {
x: pointer.x,
y: closestLine.y1,
}
if (distanceClosestPoint * 2 < adsorptionRange) {
arrivalPoint = { ...closestIntersectionPoint }
}
}
}
}