Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

节点如果是A->B,C->B,并且设置 expandHolderPosition 和 expanded,似乎树的渲染有问题 #259

Closed
fikyair opened this issue Jan 4, 2024 · 3 comments

Comments

@fikyair
Copy link

fikyair commented Jan 4, 2024

你好,rt 希望能解答一下,谢谢。示例如下

{
  "nodes": [
    {
      "id": " 1",
      "innerHTML": "text1",
      "width": 240,
      "expandHolderPosition": "right",
      "expanded": true
    },
    {
      "id": "3",
      "innerHTML": "text3",
      "width": 240,
      "expandHolderPosition": false,
      "expanded": false
    },
    {
      "id": "2",
      "innerHTML": "text2",
      "width": 240,
      "expandHolderPosition": "right",
      "expanded": true
    },
  ],
  "links": [
    {
      "from": " 1",
      "to": "3"
    },
    {
      "from": "2",
      "to": "3"
    }
  ]
}
image
@seeksdream
Copy link
Owner

你的数据被渲染的时候应该是这个效果(绿色为可见,红色为不可见):
image

你的问题应该是说节点3没有被显示,那是因为节点2设置了expaned=false(这代表节点2的子节点们被收起了,子节点将不可见),但又给节点2设置了"expandHolderPosition": false(这将让节点2 的【展开/收起】按钮不能正常显示,你也看不出来节点2是被收起的状态),所以最终的效果就是你图中的效果,节点3不可见,也看不出原因(原因是父节点节点2被收起了)

@fikyair
Copy link
Author

fikyair commented Jan 6, 2024

确实是这样,我原意这样设置是想表示:如果该结点有子结点,就要expandHolderPosition:'right',没有则expandHolderPosition:false/hide,并且,该结点有子结点 expaned 设置为 true,没有子结点设置为 false。但是发现
一种特殊的情况:A的子结点有B,C的子结点也有B,也就是 A->B,C->B ,这种情况下,图谱应该是认为,B是共同父结点了,所以会展示成上述的样子,请问还有两全的方法么

@seeksdream
Copy link
Owner

seeksdream commented Jan 7, 2024

确实是这样,我原意这样设置是想表示:如果该结点有子结点,就要expandHolderPosition:'right',没有则expandHolderPosition:false/hide,并且,该结点有子结点 expaned 设置为 true,没有子结点设置为 false。但是发现 一种特殊的情况:A的子结点有B,C的子结点也有B,也就是 A->B,C->B ,这种情况下,图谱应该是认为,B是共同父结点了,所以会展示成上述的样子,请问还有两全的方法么

图谱中的数据会被处理成每个节点必然只有一个父节点。
那么会从root开始,根据【lines中的关系顺序】来构建上下级关系,从根节点开始向外扩散,与根节点关系层级距离越小的越优先成为其他节点的父节点,与A层级距离相等时,关系越早出现在lines中的节点优先成为其他节点的父节点。以上构建过程中使用的关系与关系本身的方向无关。
假设:

nodes = [A,B,C,D,E,F],root=A
lines = [
E -> A, 
A -> B, 
F -> C, 
F -> B ,
E -> B, 
D -> B, 
D -> C ,
]

上面数据最终构建出的父子关系为:

 A
 |---- E
 |---- B
         |---- F
                  |---- C
         |----D

建议你不要手动给节点单独设置expandHolderPosition属性和expaned属性,而是设置全局的defaultExpandHolderPosition='right',这样做图谱会自动根据节点是否有子节点来管理【展开/收起】按钮是否显示。
在此基础上,你在setJsonData方法被执行之后,再去通过graphInstance.getNodes()获取节点,根据节点是否有子节点(node.lot.childs)、父节点(node.lot.parent)等条件,根据你的需要选择性的控制某些节点是否被收起(expanded=false,子节点将被隐藏)以及是否隐藏【展开/收起】按钮(expandHolderPosition=hide)。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants