vue2引用antvG6渲染树结构

首先安装antvG6

npm install @antv/g6 --save

然后再所需的.vue文件引入，或者写入公告组件

<template>
  <div class="app_box">
    <div ref="graphContainer"></div>
  </div>
</template>

<script>
import { TreeGraph } from "@antv/g6";
import G6 from "@antv/g6";
export default {
  name: "TreeGraphComponent",
  data() {
    return {
      maxDepthFromSecondLevel: null, //树结构容器的高度
      graph: null,
      dataJSon: {
        value: "落实网络和电子设备安全(D9)",
        children: [
          {
            children: [
              {
                value: "落实网络和电子设备安全落实网络和电子设备安全",
                children: [
                  {
                    value: "落实网络和电子设备安全",
                    children: [{}],
                  },
                ],
              },
            ],
            value: "落实网络和电子设备安全",
          },
          {
            children: [
              {
                value: "落实网络和电子设备安全",
                children: [
                  {
                    value: "落实网络和电子设备安全",
                    children: [{}],
                  },
                ],
              },
            ],
            value: "落实网络和电子设备安全落实网络和电子设备安全",
          },
          {
            children: [
              {
                value:
                  "落实网络和电子设备安全落实网络和电子设备安全落实网络和电子设备安全",
                children: [
                  {
                    value: "落实网络和电子设备安全",
                    children: [],
                  }