From f2594ec7df63f737ec39ec2ecb1a283092d8ad54 Mon Sep 17 00:00:00 2001
From: pissang <bm2736892@gmail.com>
Date: Wed, 22 Dec 2021 14:24:48 +0800
Subject: [PATCH 1/2] fix: optimize image type check in svg renderer.

---
 src/svg/graphic.ts | 29 +++++++++++++++++++----------
 1 file changed, 19 insertions(+), 10 deletions(-)

diff --git a/src/svg/graphic.ts b/src/svg/graphic.ts
index df63f1b10..66b33b907 100644
--- a/src/svg/graphic.ts
+++ b/src/svg/graphic.ts
@@ -29,7 +29,7 @@ import mapStyleToAttrs from './mapStyleToAttrs';
 import { SVGVNodeAttrs, createVNode, SVGVNode, vNodeToString, BrushScope } from './core';
 import { MatrixArray } from '../core/matrix';
 import Displayable from '../graphic/Displayable';
-import { assert, logError, map, retrieve2 } from '../core/util';
+import { assert, isFunction, isString, logError, map, retrieve2 } from '../core/util';
 import Polyline from '../graphic/shape/Polyline';
 import Polygon from '../graphic/shape/Polygon';
 import { GradientObject } from '../graphic/Gradient';
@@ -42,6 +42,13 @@ import { DEFAULT_FONT, DEFAULT_FONT_FAMILY } from '../core/platform';
 
 const round = Math.round;
 
+function isImageLike(val: any): val is HTMLImageElement {
+    return val && isString(val.src);
+}
+function isCanvasLike(val: any): val is HTMLCanvasElement {
+    return val && isFunction(val.toDataURL);
+}
+
 
 type AllStyleOption = PathStyleProps | TSpanStyleProps | ImageStyleProps;
 
@@ -204,12 +211,14 @@ export function brushSVGImage(el: ZRImage, scope: BrushScope) {
     const style = el.style;
     let image = style.image;
 
-    if (image instanceof HTMLImageElement) {
-        image = image.src;
-    }
-    // heatmap layer in geo may be a canvas
-    else if (image instanceof HTMLCanvasElement) {
-        image = image.toDataURL();
+    if (image && !isString(image)) {
+        if (isImageLike(image)) {
+            image = image.src;
+        }
+        // heatmap layer in geo may be a canvas
+        else if (isCanvasLike(image)) {
+            image = image.toDataURL();
+        }
     }
 
     if (!image) {
@@ -472,13 +481,13 @@ function setPattern(
         let imageHeight = val.imageHeight;
         let imageSrc;
         const patternImage = val.image;
-        if (typeof patternImage === 'string') {
+        if (isString(patternImage)) {
             imageSrc = patternImage;
         }
-        else if (patternImage instanceof HTMLImageElement) {
+        else if (isImageLike(patternImage)) {
             imageSrc = patternImage.src;
         }
-        else if (patternImage instanceof HTMLCanvasElement) {
+        else if (isCanvasLike(patternImage)) {
             imageSrc = patternImage.toDataURL();
         }
 

From 7a2a4209e58574f2c8930eccebb462e59e8059d5 Mon Sep 17 00:00:00 2001
From: pissang <bm2736892@gmail.com>
Date: Wed, 22 Dec 2021 14:30:26 +0800
Subject: [PATCH 2/2] update test case

---
 test/svg-ssr.html | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/test/svg-ssr.html b/test/svg-ssr.html
index cac180bb9..bad5ad70b 100644
--- a/test/svg-ssr.html
+++ b/test/svg-ssr.html
@@ -135,6 +135,8 @@
 
 
     // Image with cliPath
+    const imageObj = new Image();
+    imageObj.src = 'asset/test.png';
     for (let k = 0; k < 2; k++) {
         const group = new zrender.Group();
         for (let i = 0; i < 10; i++) {
@@ -142,7 +144,7 @@
                 x: i * cellSize + (cellSize - elSize) / 2,
                 y: cellSize * (5 + k),
                 style: {
-                    image: 'asset/test.png',
+                    image: k ? 'asset/test.png' : imageObj,
                     width: elSize,
                     height: elSize
                 }