feat: 添加canvas转图片方法

l-x-f · Dec 10, 2021 · f7aed9f · f7aed9f
1 parent 00bee13
commit f7aed9f
Show file tree

Hide file tree

Showing 6 changed files with 56 additions and 3 deletions.
diff --git a/dist/auto-drawing.esm.js b/dist/auto-drawing.esm.js
diff --git a/dist/auto-drawing.js b/dist/auto-drawing.js
@@ -19183,6 +19183,30 @@
       });
       return res;
     }
+    /**
+     * canvas转成图片
+     */
+
+    var canvasToImage = function canvasToImage(zr) {
+      return new Promise(function (resolve, reject) {
+        try {
+          if (zr) {
+            var canvas = zr.painter.getRenderedCanvas();
+            var base64 = canvas.toDataURL('image/jpeg', 1.0);
+            canvas.toBlob(function (blob) {
+              resolve({
+                blob: blob,
+                base64: base64
+              });
+            });
+          } else {
+            reject();
+          }
+        } catch (error) {
+          reject();
+        }
+      });
+    };
 
     /**
      * 注册画布，解决打包后出现 `Renderer 'undefined' is not imported. Please import it first` 的问题
@@ -19421,6 +19445,7 @@
       zr.add(group);
     }
 
+    exports.canvasToImage = canvasToImage;
     exports.copyArrayByCount = copyArrayByCount;
     exports.createArc = createArc;
     exports.createBezierCurve = createBezierCurve;

diff --git a/dist/auto-drawing.min.js b/dist/auto-drawing.min.js
diff --git a/dist/utils/index.d.ts b/dist/utils/index.d.ts
@@ -33,3 +33,10 @@ export declare const getMiddle: ([x1, y1]: [number, number], [x2, y2]: [number,
  * @returns
  */
 export declare function copyArrayByCount<T>(arr: T[], count?: number): T[];
+/**
+ * canvas转成图片
+ */
+export declare const canvasToImage: (zr: ZRenderType) => Promise<{
+    blob: Blob;
+    base64: string;
+}>;
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "auto-drawing",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "auto-drawing based zrender",
   "types": "dist/index.d.ts",
   "module": "dist/auto-drawing.esm.js",

diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -120,3 +120,24 @@ export function copyArrayByCount<T>(arr: T[], count = 1): T[] {
   })
   return res
 }
+
+/**
+ * canvas转成图片
+ */
+export const canvasToImage = (zr: ZRenderType): Promise<{ blob: Blob; base64: string }> => {
+  return new Promise((resolve, reject) => {
+    try {
+      if (zr) {
+        const canvas = (zr.painter as any).getRenderedCanvas()
+        const base64 = canvas.toDataURL('image/jpeg', 1.0)
+        canvas.toBlob((blob: Blob) => {
+          resolve({ blob, base64 })
+        })
+      } else {
+        reject()
+      }
+    } catch (error) {
+      reject()
+    }
+  })
+}