网络拓扑图增加标签

src/view/bank/netTopology/TopologyComponent.js

@@ -35,6 +35,19 @@ class TopologyComponent extends Component {
     }
   }
 
+    //设置高度
+    setEllipseWidth = v => {
+      let width = v === 'CCPC' ? 780 : 720;
+      return width;
+    };
+
+
+     setMargin = v => {
+      let width = v === 'CCPC' ? new go.Margin(-25,680, 0, 0) : new go.Margin(-25,610, 0, 0);
+      return width;
+    };
+
+
   // this function is the Node.dragComputation, to limit the movement of the parts
   stayInFixedArea = (part, pt, gridpt) => {
     let diagram = part.diagram;
@@ -221,6 +234,32 @@ class TopologyComponent extends Component {
         },
     ));
 
+    this.diagram.nodeTemplateMap.add(
+      'Shape',
+      goObj(
+        go.Node,
+        'Vertical',
+        new go.Binding('position', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify),
+        goObj(
+          go.Shape,
+          'Rectangle',
+          {
+            name: 'SHAPE',
+            fill: '#5BE3FF',
+            stroke: '#5BE3FF',
+            strokeWidth: 1,
+            width: 500,
+            height: 24
+          },
+          new go.Binding('width', 'text', v => this.setEllipseWidth(v))
+        ),
+        goObj(go.TextBlock, '无', { stroke: '#fff', font: 'bold 18px Microsoft YaHei UI' },
+        new go.Binding('text'),
+        new go.Binding('margin','text', v => this.setMargin(v),
+       ))
+      )
+    );
+
     this.diagram.nodeTemplateMap.add('Picture',
       goObj(go.Node, 'Vertical',
         {
@@ -336,6 +375,8 @@ class TopologyComponent extends Component {
     this.diagram.model = new go.GraphLinksModel(nodeData, linkData);
   }
 
+
+
   render() {
     const { className,style, topologyData } = this.props;
     const { nodeData = [] } = topologyData || {};