树图

树图主要用来可视化树形数据结构，是一种特殊的层次类型，具有唯一的根节点，左子树，和右子树

import * as echarts from "echarts";
export default {
  install: (app: any) => {
    app.config.globalProperties.$leida = (id: any) => {
      var chartDom = document.getElementById(id)!;
      if (chartDom == null) {
        return;
      }
      echarts.dispose(chartDom);
      var myChart = echarts.init(chartDom, "", { width: 800, height: 500 });
      $.get(
        "https://echarts.apache.org/examples/data/asset/data/flare.json",
        (data: any) => {
          console.log(data);
          data.children.forEach(function (datum: any, index: any) {
            index % 2 === 0 && (datum.collapsed = true);
          });
          console.log(data);
          var option = {
            tooltip: {
              trigger: "item",
              triggerOn: "mousemove",
            },
            series: [
              {
                type: "tree",
                data: [data],
                symbolSize: 7,
                label: {
                  position: "left",
                  verticalAlign: "middle",
                  align: "right",
                  fontSize: 9,
                },
                leaves: {
                  // 叶子节点的配置
                  label: {
                    position: "right",
                    verticalAlign: "middle",
                    align: "left",
                  },
                },
                emphasis: {
                  // 图形和标签的高亮样式
                  focus: "descendant", // 聚焦自己和子节点
                },
                expandAndCollapse: true, // 允许展开和收起
              },
            ],
          };
          myChart.setOption(option);
        }
      );
    };
  },
};