빗변 텍스트 추가 (주석으로 처리해놓음), 이미지 저장시 가이드 라인 삭제

src/hooks/useCanvas.js

@@ -503,8 +503,8 @@ export function useCanvas(id) {
    * @param {string} title - 저장할 이미지 이름
    */
   const saveImage = (title = 'canvas') => {
+    removeMouseLines()
     const dataURL = canvas?.toDataURL('png')
-
     // 이미지 다운로드 링크 생성
     const link = document.createElement('a')
     link.download = `${title}.png`
@@ -627,5 +627,6 @@ export function useCanvas(id) {
     handleFlip,
     setCanvasBackgroundWithDots,
     addCanvas,
+    removeMouseLines,
   }
 }

src/hooks/useMode.js

@@ -7,6 +7,8 @@ import {
   getDirection,
   getStartIndex,
   rearrangeArray,
+  getRoofHeight,
+  getDegreeByChon,
 } from '@/util/canvas-util'
 import { useRecoilState, useRecoilValue } from 'recoil'
 
@@ -1351,7 +1353,7 @@ export function useMode() {
   const applyTemplateA = () => {
     changeMode(canvas, Mode.EDIT)
     const polygon = drawWallPolygon(false)
-    handleClear()
+    // handleClear()
 
     if (polygon.lines.length === 4) {
       //4각형
@@ -1538,6 +1540,7 @@ export function useMode() {
       lines.push(line)
       canvas.add(line)
     }
+    canvas?.remove(polygon) //폴리곤
 
     let highLineLength = 0
     let lowLineLength = 0
@@ -1644,6 +1647,10 @@ export function useMode() {
         )
 
         canvas.add(horiCenterLine1)
+        //나중에 기울기 길이 적용할때 쓸라고 대충 냅둠
+        // canvas?.renderAll()
+        // console.log('horiCenterLine1', horiCenterLine1)
+        // horiCenterLine1.text.set('text', getRoofHeight(horiCenterLine1.length, getDegreeByChon(4)).toString())
 
         let horiCenterLine2 = new QLine(
           [