From 8dc946eb0a0c5c6b86fe50989c37be19177d35cb Mon Sep 17 00:00:00 2001
From: SHAOJIAHAO <55341701@qq.com>
Date: Tue, 25 Jul 2023 08:20:26 +0800
Subject: [PATCH] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=E9=A2=84=E8=AD=A6=E5=BC=B9?=
 =?UTF-8?q?=E5=87=BA=E6=A1=86=E6=98=BE=E7=A4=BA=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../get-out-of-line-details.component.ts      | 25 +++++++------------
 1 file changed, 9 insertions(+), 16 deletions(-)

diff --git a/src/app/pages/get-out-of-line-details/get-out-of-line-details.component.ts b/src/app/pages/get-out-of-line-details/get-out-of-line-details.component.ts
index 720bcc0..efda646 100644
--- a/src/app/pages/get-out-of-line-details/get-out-of-line-details.component.ts
+++ b/src/app/pages/get-out-of-line-details/get-out-of-line-details.component.ts
@@ -125,14 +125,11 @@ export class GetOutOfLineDetailsComponent implements OnInit {
   //清空画布并且重新标绘
   clearCanvas(url) {
     this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight);
-    var img = new Image();
-    img.src = url;
-    img.onload = () => {
-      // this.canvasWidth = img.width;
-      // this.canvasHeight = img.height;
+    let imgBg: any = document.getElementById("img");
+    imgBg.src = url;
+    imgBg.onload = () => {
       window.setTimeout(() => {
-        // 加载图片
-        this.ctx.drawImage(img, 0, 0, this.canvasWidth, this.canvasHeight);
+        this.ctx.drawImage(imgBg, 0, 0, this.canvasWidth, this.canvasHeight);
         this.strokeRect(this.currentCoordinate);
       }, 0);
     };
@@ -143,19 +140,18 @@ export class GetOutOfLineDetailsComponent implements OnInit {
   canvasLabel() {
     let imgBg: any = document.getElementById("img");
     imgBg.onload = () => {
+      // console.log("图片记载完毕!", imgBg);
       this.canvasWidth = imgBg.offsetWidth;
       this.canvasHeight = imgBg.offsetHeight;
-      const img = new Image();
-      img.src = imgBg.src;
-      img.onload = () => {
+      setTimeout(() => {
         const canvas: any = document.querySelector("#canvas");
         this.ctx = canvas.getContext("2d");
         const cWidth = canvas.width,
           cHeight = canvas.height;
         // 以图画底
-        this.ctx.drawImage(img, 0, 0, cWidth, cHeight);
+        this.ctx.drawImage(imgBg, 0, 0, cWidth, cHeight);
         this.strokeRect(this.currentCoordinate);
-      };
+      }, 0);
     };
   }
 
@@ -220,11 +216,8 @@ export class GetOutOfLineDetailsComponent implements OnInit {
 
     this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight);
     let imgBg: any = document.getElementById("img");
-    const img = new Image();
-    img.src = imgBg.src;
     const canvas: any = document.querySelector("#canvas");
-    this.ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
-
+    this.ctx.drawImage(imgBg, 0, 0, canvas.width, canvas.height);
     this.strokeRect(this.currentCoordinate);
   }