antvis / G6

♾ A Graph Visualization Framework in JavaScript.
https://g6.antv.antgroup.com/
MIT License
11.09k stars 1.32k forks source link

自定义两种节点在数据中给定了type和size,设置nodesep或者nodesepfunc仍然失效 #5405

Open RealRio opened 8 months ago

RealRio commented 8 months ago

问题描述

自定义了rect扩展而来的两种节点,single和multi,multi的高度更高。 出现了两个问题,第一个问题是nodesep设为0和nodesepfunc返回0,这两种实际导致的节点间隔不同。第二个问题是,数据中给到了size但是仍然出现节点覆盖的情况。

node数据如下: originNodes.forEach((item) => { nodes.push({ id: item.story_code, comboId: getFieldValues(item.detail?.field_values, 'parent_asset'), anchorPoints: [ [0, 0.5], [1, 0.5], ], type: item.children.length === 1 ? 'single-card' : 'multi-card', size: [ item.children.length === 1 ? 256 : 280, item.children.length === 1 ? 90 : 210, ], panels: item.children.map((child) => ({ taskCode: child.task_code, taskName: getFieldValues(child.detail.field_values, 'name'), time:getFieldValues(child.detail.field_values, 'start_time') owner: getFieldValues(child.detail.field_values, 'assignees'), status: getFieldValues(child.detail.field_values, 'status'), })), }); });

layout的config如下: layout: { type: 'dagre', rankdir: 'LR', controlPoints: true, nodesepFunc: (d) => { return 0; }, // nodesep: 0, ranksep: 100, preventOverlap: true, sortByCombo: true, }

重现链接

重现步骤

预期行为

期望在设置了size后只需要制定固定的nodesep,能根据不同node的size使用相同的nodesep,node之间不要重叠,也不要出现间距过大的情况。

平台

屏幕截图或视频(可选)

image

补充说明(可选)

No response

xiaoniao000 commented 8 months ago

我也遇到了这个问题,这个问题可以在g6的图表示例:缩进树-顶部对齐 里复现,如下图。 该示例使用的是自定义节点,在代码中添加nodeSep或nodesep都不能使node间距改变。 image 此外我发现该现象似乎针对的是自定义节点的情况,当使用内置节点时,nodeSep会生效。 我使用的是 g6 4.5.1 的版本,希望这个bug尽快修复,或者是否有什么办法可以解决这个问题。

RealRio commented 8 months ago

并没有发现解决问题的办法,另外,似乎也无法知道全部自定义节点的的render结束时机,出现了在afterrender回调执行的时候,自定义节点还没绘制好的问题。

salt-SeeSea commented 6 months ago

使用5.x版本的nodeSize属性,可以避免这个问题吗?nodeSize设置上(node)=>node.size,然后设置对应nodeSep、rankSep,可以固定间隔,保证不重叠吗

RealRio commented 6 months ago

使用5.x版本的nodeSize属性,可以避免这个问题吗?nodeSize设置上(node)=>node.size,然后设置对应nodeSep、rankSep,可以固定间隔,保证不重叠吗

不清楚5.x是否有此问题,我使用的是4.8.x版本。

Hyacinth12321 commented 5 months ago

这个问题有方法解决吗?我也遇见了