feat: 组态自动缩放问题修改

packages/extend-components/EC_ConfigurationView/src/HistoryModel.js

@@ -623,6 +623,7 @@ const ConfigurationView = (props) => {
     return () => {
       isClose = true;
       if (myDiagram) {
+        myDiagram.removeDiagramListener('ViewportBoundsChanged', viewportBoundsChang);
         myDiagram.div = null;
         myDiagram = null;
       }
@@ -1112,6 +1113,12 @@ const ConfigurationView = (props) => {
     setIsHIModalVisible(true);
   };
 
+  // 监听画布zoom变化
+  const viewportBoundsChang = () => {
+    myDiagram.contentAlignment = go.Spot.Default;
+    myDiagram.contentAlignment = go.Spot.Center;
+  };
+
   /** **********************************画布渲染************************************ */
   const diagramRender = (jsonStr, chartInfo) => {
     myDiagram = goJS(
@@ -2583,6 +2590,8 @@ const ConfigurationView = (props) => {
       if (item.controlType === '开关展示') item.switch = '是';
       if (item.category === 'valCase') item.shType = '值显示';
     });
+    // 监听画布变化
+    myDiagram.addDiagramListener('ViewportBoundsChanged', viewportBoundsChang);
     myDiagram.model = go.Model.fromJson(json);
   };
 

packages/extend-components/EC_ConfigurationView/src/RealModel.js

@@ -915,6 +915,7 @@ const ConfigurationView = (props) => {
       mqttView = null;
       if (myDiagram) {
         myDiagram.removeDiagramListener('InitialAnimationStarting', animationStarting);
+        myDiagram.removeDiagramListener('ViewportBoundsChanged', viewportBoundsChang);
         myDiagram.div = null;
         myDiagram = null;
         setIsDiagram(null);
@@ -1758,6 +1759,12 @@ const ConfigurationView = (props) => {
     if (entryAnim === 'opacity') animations.add(e.diagram, 'opacity', 0, 1);
   };
 
+  // 监听画布zoom变化
+  const viewportBoundsChang = () => {
+    myDiagram.contentAlignment = go.Spot.Default;
+    myDiagram.contentAlignment = go.Spot.Center;
+  };
+
   /** **********************************画布渲染************************************ */
   const diagramRender = (jsonStr, chartInfo) => {
     myDiagram = goJS(
@@ -3337,6 +3344,8 @@ const ConfigurationView = (props) => {
     }
     // 动画监听
     myDiagram.addDiagramListener('InitialAnimationStarting', animationStarting);
+    // 监听画布变化
+    myDiagram.addDiagramListener('ViewportBoundsChanged', viewportBoundsChang);
     myDiagram.model = go.Model.fromJson(json);
     getDataModel();
     setIsDiagram(myDiagram);

packages/extend-components/EC_ConfigurationView/src/configuration_custom.js

@@ -884,6 +884,7 @@ const ConfigurationView = (props) => {
       mqttView && mqttView.disSaveWaconnect();
       mqttView = null;
       if (myDiagram) {
+        myDiagram.removeDiagramListener('ViewportBoundsChanged', viewportBoundsChang);
         myDiagram.div = null;
         myDiagram = null;
         setIsDiagram(null);
@@ -1687,6 +1688,12 @@ const ConfigurationView = (props) => {
     return modalComponent && nodeData ? modalComponent() : null;
   };
 
+  // 监听画布zoom变化
+  const viewportBoundsChang = () => {
+    myDiagram.contentAlignment = go.Spot.Default;
+    myDiagram.contentAlignment = go.Spot.Center;
+  };
+
   /** **********************************画布渲染************************************ */
   const diagramRender = (jsonStr, chartInfo) => {
     myDiagram = goJS(
@@ -3244,6 +3251,8 @@ const ConfigurationView = (props) => {
       if (item.controlType === '开关展示') item.switch = '是';
       if (item.category === 'valCase') item.shType = '值显示';
     });
+    // 监听画布变化
+    myDiagram.addDiagramListener('ViewportBoundsChanged', viewportBoundsChang);
     myDiagram.model = go.Model.fromJson(json);
     getDataModel();
     setIsDiagram(myDiagram);