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

dag layout如何支持大小不同的节点的布局? #4000

Open
SnowfungusWang opened this issue Oct 31, 2023 · 4 comments
Open

dag layout如何支持大小不同的节点的布局? #4000

SnowfungusWang opened this issue Oct 31, 2023 · 4 comments
Labels
type: discussion 讨论 Usage questions, guidance, and other discussions

Comments

@SnowfungusWang
Copy link

Describe the bug

业务场景:在节点中存在parent node会包含其他节点,因此parent节点宽高不定。
问题:在parent节点已经调用fit修改size的情况下,再次调用dag布局,布局结果仍然认为parent节点的宽高为初始宽高(即普通节点宽高)

Your Example Website or App

https://codesandbox.io/embed/gifted-glade-8lfdrm?fontsize=14&hidenavigation=1&theme=dark

Steps to Reproduce the Bug or Issue

尝试方案:

  1. x6当前不支持对parent node的dag布局,因此尝试将节点的父子关系先解除,但保留父节点size,布局仍然和未解除时相同
  2. 尝试采用nodesepfunc和ranksepfunc,间距仍然没有改变。且在线上example中尝试修改节点大小和间距函数,但线上布局也存在重合等问题。(https://codesandbox.io/embed/gifted-glade-8lfdrm?fontsize=14&hidenavigation=1&theme=dark)

Expected behavior

期望:dag布局是否能对大小不同节点进行自动布局?如果不支持的话,有其他方案可以代替吗?

Screenshots or Videos

No response

Platform

  • OS: macOS
  • Browser:Chrome
  • Version: 1.25.3

Additional context

no others

@NewByVector
Copy link
Contributor

dagre 布局是支持不同尺寸节点布局的。需要设置一下 nodeSize: [w, h] 属性。

@NewByVector NewByVector added the type: discussion 讨论 Usage questions, guidance, and other discussions label Nov 7, 2023
@SnowfungusWang
Copy link
Author

感谢回复,在sandbox的示例中,节点6设置了width和height,但是仍然可能存在遮挡问题~

image

另外想请教一下,如果存在childNode时,直接使用dag布局可以达到parentNode和其内部都能自动完成dag吗?

非常感谢!

@SnowfungusWang
Copy link
Author

dagre 布局是支持不同尺寸节点布局的。需要设置一下 nodeSize: [w, h] 属性。

哈喽,感谢回复,时隔一年我再次尝试nodeSize属性,还是没有成功🤦‍♀️
不管是在节点中添加nodeSize: [w, h] 还是nodeSize: {w, h}的布局结果都和未添加前相同。
请问一下相关文档可以在哪里找到呢?非常感谢!

@layupbolon
Copy link

同问,请问有解决方案吗

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: discussion 讨论 Usage questions, guidance, and other discussions
Projects
None yet
Development

No branches or pull requests

3 participants