iou3344 2022-10-18 22:15 采纳率: 85.2%
浏览 100
已结题

这棵紧凑数的代码谁会改一下呢?

img


https://antv-f6.gitee.io/zh/docs/examples/tree/compactBox

这里的代码,我想弄成100层的,但是每个节点又不想要标题,请问能不能帮我搞一下data.js文件呢?
请注意图中④的注解,也即如下需求:
1、不要这些标题。
2、只要圆点。
3、而且整棵树需要向下发展100层,甚至200层。
4、我想看看到到100层时,这棵树会是怎么样的呢。

  • 写回答

2条回答 默认 最新

  • MAXLZ 2022-10-19 16:19
    关注

    不显示标题把index.js中第126行的label: node.id注释掉就可以,

    
    this.graph.node(function(node) {
          let position = 'right';
          let rotate = 0;
          if (!node.children) {
            position = 'bottom';
            rotate = Math.PI / 2;
          }
          return {
            // 不显示标题注释掉
            // label: node.id,
            labelCfg: {
              position,
              offset: 5,
              style: {
                rotate,
                textAlign: 'start',
              },
            },
          };
        });
    

    显示100层数据,写个自动生成数据的方法即可,修改data.js

    // level为显示的层数,num为每个节点的子节点数量
    function treeData(level, num = 2) {
      const res = {id: Math.random() + '', children: []}
      const fn = (res, curLevel) => {
        if (curLevel === level) return
        for (let i = 0; i < num; i++){
          const item = {id: Math.random() + '', children: []}
          res.push(item)
          fn(item.children, curLevel + 1)
        }
      }
      fn(res.children, 1)
      return res
    }
    
    const data = treeData(5)
    
    export default data
    

    事实上,你即使显示20层数据,每个节点2个子节点,就有2^20-1个节点了,那就是十多万的节点数,对于这个量级数据,f6好想并不能很好地渲染

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 10月28日
  • 已采纳回答 10月20日
  • 修改了问题 10月18日
  • 创建了问题 10月18日

悬赏问题

  • ¥15 使用Jdk8自带的算法,和Jdk11自带的加密结果会一样吗,不一样的话有什么解决方案,Jdk不能升级的情况
  • ¥15 画两个图 python或R
  • ¥15 在线请求openmv与pixhawk 实现实时目标跟踪的具体通讯方法
  • ¥15 八路抢答器设计出现故障
  • ¥15 opencv 无法读取视频
  • ¥15 用matlab 实现通信仿真
  • ¥15 按键修改电子时钟,C51单片机
  • ¥60 Java中实现如何实现张量类,并用于图像处理(不运用其他科学计算库和图像处理库))
  • ¥20 5037端口被adb自己占了
  • ¥15 python:excel数据写入多个对应word文档