X6 icon indicating copy to clipboard operation
X6 copied to clipboard

自动布局,设置align: "UL"后布局问题

Open news-ttt opened this issue 1 year ago • 0 comments

Describe the bug

使用自动布局那个例子,将align改为UL,给第二层节点增加若干,给增加的最后一个第二层节点增加一个第三层节点,这时自动布局会将上面的节点分到下面来,很丑 image

Your Example Website or App

https://x6.antv.antgroup.com/examples/showcase/practices#orgchart

Steps to Reproduce the Bug or Issue

  1. 设置 g.setGraph({ rankdir: dir, align: "UL", nodesep: 50, ranksep: 50 })
  2. 设置数据如下
const nodes = [
  createNode('Founder & Chairman', 'Pierre Omidyar', male),
  createNode('President & CEO', 'Margaret C. Whitman', female),
  createNode('President, PayPal', 'Scott Thompson', male),
  createNode('President, Ebay Global Marketplaces', 'Devin Wenig', male),
  createNode('Senior Vice President Human Resources', 'Jeffrey S. Skoll', male),
  createNode('Senior Vice President Controller', 'Steven P. Westly', male),
  createNode('President & CEO', 'Margaret C. Whitman', female),
  createNode('President, PayPal', 'Scott Thompson', male),
  createNode('President, Ebay Global Marketplaces', 'Devin Wenig', male),
  createNode('Senior Vice President Human Resources', 'Jeffrey S. Skoll', male),
  createNode('Senior Vice President Controller', 'Steven P. Westly', male),
  createNode('Senior Vice President Controller', 'Steven P. Westly', male),
]

const edges = [
  createEdge(nodes[0], nodes[1]),
  createEdge(nodes[0], nodes[6]),
  createEdge(nodes[0], nodes[7]),
  createEdge(nodes[0], nodes[8]),
  createEdge(nodes[0], nodes[9]),
  createEdge(nodes[0], nodes[10]),
  createEdge(nodes[0], nodes[2]),
  createEdge(nodes[1], nodes[3]),
  createEdge(nodes[1], nodes[4]),
  createEdge(nodes[1], nodes[5]),
  createEdge(nodes[10], nodes[11]),
]

自动布局会触发样式的问题

Expected behavior

上面的节点还是固定在那,下面的还是在下面

Screenshots or Videos

No response

Platform

  • OS: Windows
  • Browser: Chrome
  • Version: 2.*

Additional context

No response

news-ttt avatar Jan 24 '24 07:01 news-ttt