Browse Source

导航中的节点可以进行选择

Kevin Jiang 3 years ago
parent
commit
3df1405636
1 changed files with 18 additions and 16 deletions
  1. 18 16
      src/views/knowledge-grapn/KnowLedgeGraphView.vue

+ 18 - 16
src/views/knowledge-grapn/KnowLedgeGraphView.vue

@@ -35,11 +35,12 @@ function initGraph(data: GraphData) {
     },
     modes: {
       // 允许拖拽画布、放缩画布、拖拽节点
-      default: ['drag-canvas', 'zoom-canvas', 'drag-node'],
+      default: ['drag-canvas', 'zoom-canvas', 'drag-node', 'click-select'],
     },
     nodeStateStyles: {
-      hover: {
-        fill: 'lightsteelblue',
+      selected: {
+        stroke: '#FBEECD',
+        fill: '#F79767',
       },
     },
     defaultNode: {
@@ -48,16 +49,17 @@ function initGraph(data: GraphData) {
       style: {
         stroke: '#F36924',
         fill: '#F79767'
-      }
+      },
+      // 选中颜色为 #FBEECD
     },
     defaultEdge: {
       label: '下级学科',
       size: 1,
-      color: '#b6bbc5',
+      color: '#B6BBC5',
       style: {
         endArrow: {
           path: 'M 0,0 L 8,4 L 8,-4 Z',
-          fill: '#b6bbc5',
+          fill: '#B6BBC5',
         },
       },
     },
@@ -67,16 +69,16 @@ function initGraph(data: GraphData) {
   // 渲染图
   graph.render();
   // 监听节点点击事件
-  graph.on('node:click', event => {
-    const nodes = data['nodes']
-    const index = nodes.findIndex(n => n.id == event.item?.getID())
-    if (index > -1) {
-      const node = nodes[index];
-      searchSubject(node.label);
-
-      kgGraphStore.search(node.label);
-    }
-  });
+  // graph.on('node:click', event => {
+  //   const nodes = data['nodes']
+  //   const index = nodes.findIndex(n => n.id == event.item?.getID())
+  //   if (index > -1) {
+  //     const node = nodes[index];
+  //     searchSubject(node.label);
+
+  //     kgGraphStore.search(node.label);
+  //   }
+  // });
 }
 
 onMounted(() => {