diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx
index 924bfa95..4546034e 100644
--- a/src/components/floor-plan/CanvasMenu.jsx
+++ b/src/components/floor-plan/CanvasMenu.jsx
@@ -153,6 +153,17 @@ export default function CanvasMenu(props) {
     setIsGlobalLoading(false)
   }
 
+  // roof 초기화
+  const initRoofs = () => {
+    const roofs = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF)
+    roofs.forEach((roof) => {
+      roof.set({ selectable: true })
+      setSurfaceShapePattern(roof, null, false, roof.roofMaterial)
+      delete roof.moduleCompass
+      drawDirectionArrow(roof)
+    })
+  }
+
   const onClickNav = async (menu) => {
     switch (menu.index) {
       case 0:
@@ -184,13 +195,7 @@ export default function CanvasMenu(props) {
               type: 'confirm',
               confirmFn: () => {
                 //해당 메뉴 이동시 배치면 삭제
-                const roofs = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF)
-                roofs.forEach((roof) => {
-                  roof.set({ selectable: true })
-                  setSurfaceShapePattern(roof, null, false, roof.roofMaterial)
-                  delete roof.moduleCompass
-                  drawDirectionArrow(roof)
-                })
+                initRoofs()
 
                 const moduleSurfacesArray = canvas
                   .getObjects()
@@ -314,13 +319,7 @@ export default function CanvasMenu(props) {
     if (menuNumber === 3) {
       const moduleSurfacesArray = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
       if (moduleSurfacesArray.length > 0) {
-        const roofs = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF)
-        roofs.forEach((roof) => {
-          roof.set({ selectable: true })
-          setSurfaceShapePattern(roof, null, false, roof.roofMaterial)
-          delete roof.moduleCompass
-          drawDirectionArrow(roof)
-        })
+        initRoofs()
         moduleSurfacesArray.forEach((moduleSurface) => {
           moduleSurface.modules = []
           canvas.remove(moduleSurface)