diff --git a/src/components/floor-plan/CanvasFrame.jsx b/src/components/floor-plan/CanvasFrame.jsx index e6261edc..086e9441 100644 --- a/src/components/floor-plan/CanvasFrame.jsx +++ b/src/components/floor-plan/CanvasFrame.jsx @@ -22,7 +22,7 @@ export default function CanvasFrame({ plan }) { }, }) const { checkCanvasObjectEvent, checkUnsavedCanvasPlan } = usePlan() - const { canvasLoadInit } = useCanvasConfigInitialize() + const { canvasLoadInit, gridInit } = useCanvasConfigInitialize() const currentObject = useRecoilValue(currentObjectState) useEvent() @@ -32,10 +32,11 @@ export default function CanvasFrame({ plan }) { canvas?.clear() // 캔버스를 초기화합니다. if (plan?.canvasStatus) { canvas?.loadFromJSON(JSON.parse(plan.canvasStatus), function () { - canvas?.renderAll() // 캔버스를 다시 그립니다. canvasLoadInit() //config된 상태로 캔버스 객체를 그린다 + canvas?.renderAll() // 캔버스를 다시 그립니다. }) } + gridInit() } } diff --git a/src/hooks/common/useCanvasConfigInitialize.js b/src/hooks/common/useCanvasConfigInitialize.js index fd5d4542..2e91fad1 100644 --- a/src/hooks/common/useCanvasConfigInitialize.js +++ b/src/hooks/common/useCanvasConfigInitialize.js @@ -31,6 +31,12 @@ export function useCanvasConfigInitialize() { roofInit() //화면표시 초기화 } + const gridInit = () => { + setDotLineGridSetting((prev) => { + return { ...prev, INTERVAL: { ...prev.INTERVAL } } + }) + } + //치수표시, 화면표시, 글꼴등 초기화 const roofInit = () => { setSettingModalFirstOptions((prev) => { @@ -46,10 +52,7 @@ export function useCanvasConfigInitialize() { }) return { ...prev, option1, option2, dimensionDisplay } }) - - setDotLineGridSetting((prev) => { - return { ...prev } - }) + gridInit() setGlobalFonts((prev) => { const commonText = { ...prev.commonText } @@ -61,5 +64,5 @@ export function useCanvasConfigInitialize() { }) } - return { canvasLoadInit } + return { canvasLoadInit, gridInit } } diff --git a/src/hooks/option/useFirstOption.js b/src/hooks/option/useFirstOption.js index 5a4605e9..6f906199 100644 --- a/src/hooks/option/useFirstOption.js +++ b/src/hooks/option/useFirstOption.js @@ -33,7 +33,7 @@ export function useFirstOption() { optionName = ['outerLine', 'wallLine'] break case 'gridDisplay': //그리드 표시 - optionName = ['lindGrid', 'dotGrid'] + optionName = ['lineGrid', 'dotGrid'] break case 'lineDisplay': //지붕선 표시 optionName = ['roof', 'roofBase'] @@ -45,7 +45,7 @@ export function useFirstOption() { optionName = ['7'] break case 'flowDisplay': //흐름방향 표시 - optionName = ['arrow'] + optionName = ['arrow', 'flowText'] break case 'trestleDisplay': //가대 표시 optionName = ['8'] @@ -66,6 +66,8 @@ export function useFirstOption() { //obj.set({ visible: !obj.visible }) }) + canvas.renderAll() + // console.log( // 'optionName', // optionName, diff --git a/src/hooks/useCanvas.js b/src/hooks/useCanvas.js index 17f00eea..886407b4 100644 --- a/src/hooks/useCanvas.js +++ b/src/hooks/useCanvas.js @@ -12,7 +12,6 @@ import { defineQPloygon } from '@/util/qpolygon-utils' import { writeImage } from '@/lib/canvas' import { useCanvasEvent } from '@/hooks/useCanvasEvent' import { useAxios } from '@/hooks/useAxios' -import { v4 as uuidv4 } from 'uuid' import { useFont } from '@/hooks/common/useFont' export function useCanvas(id) { @@ -93,8 +92,6 @@ export function useCanvas(id) { canvas.getObjects().length > 0 && canvas?.clear() // settings for all canvas in the app fabric.Object.prototype.transparentCorners = false - fabric.Object.prototype.id = uuidv4() - fabric.Object.prototype.uuid = uuidv4() fabric.Object.prototype.selectable = true fabric.Object.prototype.lockMovementX = true fabric.Object.prototype.lockMovementY = true