ソースを参照

网络图暂存

tyler 2 年 前
コミット
e292df4468
2 ファイル変更30 行追加18 行削除
  1. 4 4
      src/components/TreeChart/index.vue
  2. 26 14
      src/views/atlas/placement-network-ex.vue

+ 4 - 4
src/components/TreeChart/index.vue

@@ -23,8 +23,8 @@ export default {
     this.init()
     // 监听树图节点的点击事件
     myChart.on('click', (e) => {
-      console.log('e:', e)
-      this.$emit('clickNode', e.data)
+      // console.log('e:', e)
+      this.$emit('clickNode', e)
     })
   },
   methods: {
@@ -80,9 +80,9 @@ export default {
               min: 0.5,
               max: 10
             },
-            // initialTreeDepth: 2, // 树图初始的展开层级(深度),根节点是0,不设置时全部展开
+            initialTreeDepth: 5, // 树图初始的展开层级(深度),根节点是0,不设置时全部展开
             // symbol: 'arrow', // 标记的图形,默认是emptyCircle;circle,rect,roundRect,triangle,diamond,pin,arrow,none
-            // symbolRotate: 270, // 配合arrow图形使用效果较好
+            symbolRotate: 270, // 配合arrow图形使用效果较好
             symbolSize: 16, // 大于0时是圆圈,等于0时不展示,标记的大小
             itemStyle: { // 树图中每个节点的样式
               color: '#1890FF', // 节点未展开时的填充色

+ 26 - 14
src/views/atlas/placement-network-ex.vue

@@ -90,8 +90,11 @@ export default {
     this.getMainData(null, true)
   },
   methods: {
-    getNodeData(data) {
-      console.log(data)
+    getNodeData(e) {
+      console.log(e)
+      if (e.collapsed === false) {
+        console.log(e.name + '---节点展开')
+      }
     },
     getList() {
       this.treeData = {
@@ -154,11 +157,18 @@ export default {
         data.isExpanded = true
         const allData = response.data.allData
         // const allData = that.traversalTree(data,that)
-        allData.map((item, index) => {
+        allData.forEach((item) => {
+          console.log(item)
           item.name = item.USER_NAME
+          if (item.children && item.children.length > 0) {
+            console.log(item.children)
+            item.children.forEach((child) => {
+              child.name = child.USER_NAME
+            })
+          }
         })
-        const list = []
-        // that.treeData.children = that.traversalTree( allData,list )
+        // that.treeData.children = that.traversalTree( allData )
+        console.log(that.traversalTree(allData))
         that.treeData.children = allData
 
         that.treeChartShow = true
@@ -167,15 +177,17 @@ export default {
         }, 1.5 * 1000)
       })
     },
-    traversalTree(arrs, that) {
-      arrs.map((item, index) => {
-        that.push({
-          name: item.USER_NAME,
-          children: []
-        })
-
-        if (item.children.length !== 0) {
-          this.traversalTree(item.children, that[index].children)
+    traversalTree(tree) {
+      const that = this
+      console.log(tree)
+      tree.forEach((item) => {
+        console.log(item)
+        item.name = item.USER_NAME
+        if (item.children && item.children.length > 0) {
+          console.log(item.children)
+          item.children.forEach((child) => {
+            that.traversalTree(child)
+          })
         }
       })
     },