IssueHuntdagre 布局方式 设置preset 记录上次布局结果无效 #4947
tgp0315 posted onGitHub
问题描述
使用dagre 布局方式完成画布初始化后，用户通过拖拽改变了某些节点的坐标，同时本地缓存数据，期望在页面刷新时按照刷新前的布局进行渲染，但是根据文档配置之后，没有效果，麻烦大佬们给看看是不是使用方式有问题
重现链接
无
重现步骤
使用了两种方式：
1.初始化时添加
`graph = new G6.Graph({ container: "mountNode", width, height, fitView: true, //设置是否将图充满整个画布 modes: { default: [ "drag-canvas", "drag-node", "zoom-canvas" ], }, layout: { type: "dagre", direction: "H", rankdir: "LR", nodeOrder: [ "1", "2", "3", "4", ], preset: { nodes: [ { x: 135, y: 52.5, layer: 0, _order: 0, }, { x: 895, y: 50, _order: 0, }, { x: 515, y: 397.5, _order: 0, }, { x: 895, y: 185, _order: 1, }, { x: 1010.1662725094204, y: 316.05504679538484, _order: 2, }, ], }, nodesepFunc: () => 30, ranksepFunc: () => 200, preventOverlap: true, }, defaultNode: { type: "custom-nodes", }, defaultEdge: { type: "line", labelCfg: { autoRotate: true, //设置边上面的标签的样式 position: "center", style: { stroke: "#fff", lineWidth: 10, cursor: "pointer", }, }, }, });
graph.data(data); graph.render();`
2.render完成之后updateLayout
graph.updateLayout({
nodeOrder: [
"1",
"2",
"3"
],
preset: {
nodes: [
{
x: 135,
y: 52.5,
layer: 0,
_order: 0,
},
{
x: 895,
y: 50,
_order: 0,
},
{
x: 515,
y: 397.5,
_order: 0,
},
{
id: "TSrxKpsxEj5DmsWVy8wowukpK5gQSG9d6p",
x: 895,
y: 185,
_order: 1,
},
{
x: 1010.1662725094204,
y: 316.05504679538484,
_order: 2,
}
],
},
});
预期行为
期望在查看画布或者刷新页面时记录画布的布局
平台
- 操作系统: [macOS, Windows, Linux, React Native ...]
- 网页浏览器: [Google Chrome, Safari, Firefox]
- G6 版本: [4.5.1 ... ]
屏幕截图或视频（可选）
No response
补充说明（可选）
No response
