关系图调整

src/view/Manage/AssetBrowse/Component/Relation.jsx

@@ -2,11 +2,12 @@ import React from 'react';
 
 import Chart from '@antv/chart-node-g6';
 import G6 from '@antv/g6';
+import { isSzseEnv } from '../../../../util';
 
 import centerImg from '../assets/center.png';
 import expandImg from '../assets/expand.png';
 
-const maxInnerRaduis = 40, imageWidth = 30, textFontSize = 8;
+const maxInnerRaduis = 40, imageWidth = 20, textFontSize = 8;
 
 const centerColorGroup = ['#D8E9FF', '#A7CEFF', '#196AD2'];
 const centerHighlightColorGroup = ['#99c6ff', '#4d8ddf', '#145ab3'];
@@ -73,7 +74,10 @@ const init = (ctx) => function (container, data, onCenterClick, onExpandClick) {
   });
 
   const calcRaduis = (node) => {
-    if (!node?.levelId) return { innerRaduis: maxInnerRaduis, raduis: maxInnerRaduis+30 };
+
+    const outerRaduis = (isSzseEnv ? 20 : 30)
+
+    if (!node?.levelId) return { innerRaduis: maxInnerRaduis, raduis: (maxInnerRaduis+outerRaduis) };
 
     const nodeLevel = node?.levelId.split('-').length;
     let innerRaduis = maxInnerRaduis;
@@ -85,21 +89,7 @@ const init = (ctx) => function (container, data, onCenterClick, onExpandClick) {
       innerRaduis = 15;
     }
 
-    return { innerRaduis, raduis: (innerRaduis+30) };
-  }
-
-  const calcOpacity = (node) => {
-    const nodeLevel = node?.levelId.split('-').length;
-
-    if (nodeLevel <=2) return 1.0;
-
-    if (nodeLevel === 3) return 0.8;
-
-    if (nodeLevel === 4) return 0.6;
-
-    if (nodeLevel === 5) return 0.4;
-
-    return 0.3;
+    return { innerRaduis, raduis: (innerRaduis+outerRaduis) };
   }
 
   const calcSecondaryNodeColor = (node) => {
@@ -120,7 +110,6 @@ const init = (ctx) => function (container, data, onCenterClick, onExpandClick) {
 
       const { innerRaduis, raduis } = calcRaduis(cfg);
       const { nodeColor, nodeHighlightColor } = calcSecondaryNodeColor(cfg);
-      const opacity = calcOpacity(cfg);
 
       const nodeLevel = cfg?.levelId.split('-').length;
       let chartColor = '';
@@ -174,7 +163,6 @@ const init = (ctx) => function (container, data, onCenterClick, onExpandClick) {
           .style({
             lineWidth: 0,
             cursor: 'pointer',
-            fillOpacity: opacity,
           })
           .state({
             active: {
@@ -291,7 +279,7 @@ const init = (ctx) => function (container, data, onCenterClick, onExpandClick) {
             r: innerRaduis,
             lineWidth: 0,
             fill: nodeColor,
-            fillOpacity: opacity,
+            fillOpacity: 1.0,
             stroke: '#fff',
             strokeOpacity: 0,
             cursor: (cfg?.virtual)?'':'pointer',