Procházet zdrojové kódy

fix:解决截图有白边的问题

奔跑的面条 před 3 roky
rodič
revize
e74f796203
2 změnil soubory, kde provedl 6 přidání a 2 odebrání
  1. 3 1
      src/utils/utils.ts
  2. 3 1
      src/views/chart/hooks/useSync.hook.ts

+ 3 - 1
src/utils/utils.ts

@@ -155,7 +155,9 @@ export const canvasCut = (html: HTMLElement | null, callback?: Function) => {
     return
   }
 
-  html2canvas(html).then((canvas: HTMLCanvasElement) => {
+  html2canvas(html, {
+    backgroundColor: null
+  }).then((canvas: HTMLCanvasElement) => {
     window['$message'].success('导出成功!')
     downloadByA(canvas.toDataURL(), undefined, 'png')
     if (callback) callback()

+ 3 - 1
src/views/chart/hooks/useSync.hook.ts

@@ -133,7 +133,9 @@ export const useSync = () => {
     const range = document.querySelector('.go-edit-range') as HTMLElement
     const ruler = document.getElementById('mb-ruler')
     // 生成图片
-    const canvasImage: HTMLCanvasElement = await html2canvas(range)
+    const canvasImage: HTMLCanvasElement = await html2canvas(range, {
+      backgroundColor: null
+    })
     
     // 上传预览图
     let uploadParams = new FormData()