diff --git a/src/components/floor-plan/modal/setting01/SecondOption.jsx b/src/components/floor-plan/modal/setting01/SecondOption.jsx index f264edb2..d0acddb2 100644 --- a/src/components/floor-plan/modal/setting01/SecondOption.jsx +++ b/src/components/floor-plan/modal/setting01/SecondOption.jsx @@ -185,7 +185,7 @@ export default function SecondOption(props) { const onClickOption = async (item) => { let option4Data = settingModalSecondOptions?.option4 - let adsorpPointData = adsorptionPointMode.adsorptionPoint + let adsorpPointData = adsorptionPointMode //흡착범위 설정(단 건 선택) if ( @@ -203,11 +203,9 @@ export default function SecondOption(props) { //흡착점 범위 setAdsorptionRange(item.range) - - setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: adsorpPointData }) + setAdsorptionPointMode(adsorpPointData) } else if (item === 'adsorpPoint') { - setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: !adsorpPointData }) - adsorpPointData = !adsorpPointData + setAdsorptionPointMode(!adsorpPointData) } setSettingsData({ ...settingsData, option4: [...option4Data], adsorptionPoint: adsorpPointData }) @@ -257,7 +255,7 @@ export default function SecondOption(props) { }} > {getMessage('modal.canvas.setting.font.plan.absorption.point')} - {adsorptionPointMode.adsorptionPoint ? 'ON' : 'OFF'} + {adsorptionPointMode ? 'ON' : 'OFF'} diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js index 7bde5638..6cd11a2d 100644 --- a/src/hooks/option/useCanvasSetting.js +++ b/src/hooks/option/useCanvasSetting.js @@ -609,7 +609,7 @@ export function useCanvasSetting(executeEffect = true) { const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item })) /** 흡착점 ON/OFF */ - setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: res.adsorpPoint }) + setAdsorptionPointMode(res.adsorpPoint) /** 치수선 설정 */ setDimensionLineSettings({ ...dimensionLineSettings, pixel: res.originPixel, color: res.originColor }) @@ -695,7 +695,7 @@ export function useCanvasSetting(executeEffect = true) { /** 조회된 글꼴 데이터가 없는 경우 (데이터 초기화) */ /** 흡착점 ON/OFF */ - setAdsorptionPointMode({ ...adsorptionPointMode, adsorptionPoint: false }) + setAdsorptionPointMode(false) /** 치수선 설정 */ resetDimensionLineSettings() @@ -775,7 +775,7 @@ export function useCanvasSetting(executeEffect = true) { adsorpRangeMedium: dataToSend.secondOption2[2].selected, adsorpRangeLarge: dataToSend.secondOption2[3].selected, /** 흡착점 ON/OFF */ - adsorpPoint: adsorptionPointMode.adsorptionPoint, + adsorpPoint: adsorptionPointMode, //??: adsorptionRange, 사용여부 확인 필요 /** 문자 글꼴 설정 */ diff --git a/src/hooks/useEvent.js b/src/hooks/useEvent.js index 593fd76f..18e3907b 100644 --- a/src/hooks/useEvent.js +++ b/src/hooks/useEvent.js @@ -104,24 +104,35 @@ export function useEvent() { if (dotLineGridSetting.LINE || canvas.getObjects().filter((obj) => ['lineGrid', 'tempGrid'].includes(obj.name)).length > 0) { const closestLine = getClosestLineGrid(pointer) - const horizonLines = canvas.getObjects().filter((obj) => obj.name === 'lineGrid' && obj.direction === 'horizontal') - const verticalLines = canvas.getObjects().filter((obj) => obj.name === 'lineGrid' && obj.direction === 'vertical') + const horizonLines = canvas.getObjects().filter((obj) => ['lineGrid', 'tempGrid'].includes(obj.name) && obj.direction === 'horizontal') + const verticalLines = canvas.getObjects().filter((obj) => ['lineGrid', 'tempGrid'].includes(obj.name) && obj.direction === 'vertical') if (!horizonLines || !verticalLines) { return } - const closestHorizontalLine = horizonLines.reduce((prev, curr) => { - const prevDistance = calculateDistance(pointer, prev) - const currDistance = calculateDistance(pointer, curr) - return prevDistance < currDistance ? prev : curr - }) + let closestHorizontalLine = null + let closestVerticalLine = null - const closestVerticalLine = verticalLines.reduce((prev, curr) => { - const prevDistance = calculateDistance(pointer, prev) - const currDistance = calculateDistance(pointer, curr) - return prevDistance < currDistance ? prev : curr - }) + if (horizonLines && horizonLines.length > 0) { + closestHorizontalLine = horizonLines.reduce((prev, curr) => { + const prevDistance = calculateDistance(pointer, prev) + const currDistance = calculateDistance(pointer, curr) + return prevDistance < currDistance ? prev : curr + }) + } + + if (verticalLines && verticalLines.length > 0) { + closestVerticalLine = verticalLines.reduce((prev, curr) => { + const prevDistance = calculateDistance(pointer, prev) + const currDistance = calculateDistance(pointer, curr) + return prevDistance < currDistance ? prev : curr + }) + } + + if (!closestVerticalLine || !closestHorizontalLine) { + return + } const closestIntersectionPoint = calculateIntersection(closestHorizontalLine, closestVerticalLine)