From 5665715a99d5a50e84db414c06debe36b4ebd9f7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=8F=B2=E6=82=A6?= <shiyue@hdzxbj.com>
Date: Tue, 28 Oct 2025 15:49:00 +0800
Subject: [PATCH] =?UTF-8?q?-=20=E5=9C=A8=20js/core/app-shell.js:1153=20?=
 =?UTF-8?q?=E4=B8=BA=20initializeMermaidPanZoom=20=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E7=A9=BA=E5=80=BC=E4=BF=9D=E6=8A=A4=EF=BC=8C=E9=81=BF=E5=85=8D?=
 =?UTF-8?q?=E6=89=BE=E4=B8=8D=E5=88=B0=E7=9B=AE=E6=A0=87=E5=85=83=E7=B4=A0?=
 =?UTF-8?q?=E6=97=B6=E7=9B=B4=E6=8E=A5=20=20=20=20=20=E8=BF=94=E5=9B=9E?=
 =?UTF-8?q?=E3=80=82=20=20=20-=20=E6=96=B0=E5=A2=9E=20applyMermaidPanZoom?=
 =?UTF-8?q?=20=E8=BE=85=E5=8A=A9=E6=96=B9=E6=B3=95=EF=BC=88js/core/app-she?=
 =?UTF-8?q?ll.js:1227=EF=BC=89=EF=BC=8C=E7=BB=9F=E4=B8=80=E4=B8=BA?=
 =?UTF-8?q?=E6=9C=80=E6=96=B0=E6=B8=B2=E6=9F=93=E7=9A=84=20Mermaid=20SVG?=
 =?UTF-8?q?=20=E8=AE=BE=E7=BD=AE=E7=A8=B3=20=20=20=20=20=E5=AE=9A=E7=9A=84?=
 =?UTF-8?q?=20id=20=E5=B9=B6=E9=87=8D=E6=96=B0=E5=88=9D=E5=A7=8B=E5=8C=96?=
 =?UTF-8?q?=20svgPanZoom=EF=BC=8C=E4=BF=9D=E8=AF=81=E7=BC=A9=E6=94=BE?=
 =?UTF-8?q?=E5=AE=9E=E4=BE=8B=E5=A7=8B=E7=BB=88=E5=AD=98=E5=9C=A8=E3=80=82?=
 =?UTF-8?q?=20=20=20-=20=E5=9C=A8=E6=B5=81=E5=BC=8F=E6=B8=B2=E6=9F=93?=
 =?UTF-8?q?=E5=AE=8C=E6=88=90=E7=9A=84=E5=BE=AA=E7=8E=AF=E4=B8=AD=E8=BF=BD?=
 =?UTF-8?q?=E5=8A=A0=20this.applyMermaidPanZoom(manifest)=EF=BC=88js/core/?=
 =?UTF-8?q?app-shell.js:1329=EF=BC=89=EF=BC=8C=E7=94=9F=E6=88=90=E6=9C=80?=
 =?UTF-8?q?=E5=90=8E=20=20=20=20=20=E4=B8=80=E4=B8=AA=E4=BB=A3=E7=A0=81?=
 =?UTF-8?q?=E7=89=87=E6=AE=B5=E5=90=8E=E7=AB=8B=E5=8D=B3=E6=81=A2=E5=A4=8D?=
 =?UTF-8?q?=E7=BC=A9=E6=94=BE=E8=83=BD=E5=8A=9B=E3=80=82=20=20=20-=20?=
 =?UTF-8?q?=E5=9C=A8=E6=9C=80=E7=BB=88=E6=B8=B2=E6=9F=93=E5=9B=9E=E5=86=99?=
 =?UTF-8?q?=E4=B8=8E=E5=B8=B8=E8=A7=84=E6=B8=B2=E6=9F=93=E5=85=A5=E5=8F=A3?=
 =?UTF-8?q?=E5=88=86=E5=88=AB=E8=B0=83=E7=94=A8=E6=96=B0=E6=96=B9=E6=B3=95?=
 =?UTF-8?q?=EF=BC=88js/core/app-shell.js:1397,=20js/core/app-shell.js:1451?=
 =?UTF-8?q?=EF=BC=89=EF=BC=8C=20=20=20=20=20=E7=A1=AE=E4=BF=9D=E6=97=A0?=
 =?UTF-8?q?=E8=AE=BA=E6=98=AF=E6=B5=81=E5=BC=8F=E7=BB=93=E6=9D=9F=E8=BF=98?=
 =?UTF-8?q?=E6=98=AF=E5=88=87=E6=8D=A2=E5=8E=86=E5=8F=B2=E8=AE=B0=E5=BD=95?=
 =?UTF-8?q?=E9=83=BD=E8=83=BD=E8=87=AA=E5=8A=A8=E5=90=AF=E7=94=A8=E5=B9=B3?=
 =?UTF-8?q?=E7=A7=BB=E7=BC=A9=E6=94=BE=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 js/core/app-shell.js | 33 ++++++++++++++++++++++++++++-----
 1 file changed, 28 insertions(+), 5 deletions(-)

diff --git a/js/core/app-shell.js b/js/core/app-shell.js
index 811b0dd..3f049ed 100644
--- a/js/core/app-shell.js
+++ b/js/core/app-shell.js
@@ -1151,6 +1151,7 @@
     }
 
     initializeMermaidPanZoom(svgElementid, manifest) {
+      if (!svgElementid) return;
       let svgElement = document.getElementById(svgElementid);
       if (!svgElement) return;
       if (!window.svgPanZoom) {
@@ -1223,6 +1224,28 @@
       this.mermaidPanZoom = null;
     }
 
+    applyMermaidPanZoom(manifest) {
+      if (
+        !manifest ||
+        manifest.artifact?.type !== 'mermaid' ||
+        !this.el.viewer
+      ) {
+        return;
+      }
+      const svgElement = this.el.viewer.querySelector('svg');
+      if (!svgElement) return;
+      let svgId = svgElement.getAttribute('id');
+      if (!svgId) {
+        svgId =
+          (typeof Utils !== 'undefined' &&
+            typeof Utils.generateId === 'function' &&
+            Utils.generateId('mermaidSvg')) ||
+          `mermaidSvg-${Date.now()}`;
+        svgElement.setAttribute('id', svgId);
+      }
+      this.initializeMermaidPanZoom(svgId, manifest);
+    }
+
     isZoomableManifest(manifest) {
       const type = manifest?.artifact?.type;
       return type === 'svg' || type === 'mermaid';
@@ -1302,6 +1325,9 @@
               applyTransform: false,
               wrapperClasses: ['svg-content-wrapper--mermaid']
             });
+            if (ctx.completed) {
+              this.applyMermaidPanZoom(manifest);
+            }
           } catch (error) {
             ctx.lastError = error;
             console.warn('Mermaid 流式渲染失败，等待更多内容补全:', error);
@@ -1368,6 +1394,7 @@
               applyTransform: false,
               wrapperClasses: ['svg-content-wrapper--mermaid']
             });
+            this.applyMermaidPanZoom(manifest);
           }
         } catch (error) {
           console.warn('Mermaid 最终渲染失败:', error);
@@ -1421,11 +1448,7 @@
           applyTransform: false,
           wrapperClasses: ['svg-content-wrapper--mermaid']
         });
-        const svgElement = this.el.viewer.querySelector('svg');
-        if (svgElement) {
-          const svgid = svgElement.getAttribute('id', 'mermaidSvg');
-          this.initializeMermaidPanZoom(svgid, manifest);
-        }
+        this.applyMermaidPanZoom(manifest);
       } catch (error) {
         this.destroyMermaidPanZoom();
         console.error('Mermaid 渲染失败:', error);