| @@ -51,8 +51,16 @@ const EditPipeline = () => { | |||||
| return item.id === val.id; | return item.id === val.id; | ||||
| }); | }); | ||||
| data.nodes[index] = val; | data.nodes[index] = val; | ||||
| const zoom = graph.getZoom(); | |||||
| // 在拉取新数据重新渲染页面之前先获取点(0, 0)在画布上的位置 | |||||
| const lastPoint = graph.getCanvasByPoint(0, 0); | |||||
| graph.changeData(data); | graph.changeData(data); | ||||
| graph.render(); | graph.render(); | ||||
| graph.zoomTo(zoom); | |||||
| // 获取重新渲染之后点(0, 0)在画布的位置 | |||||
| const newPoint = graph.getCanvasByPoint(0, 0); | |||||
| // 移动画布相对位移; | |||||
| graph.translate(lastPoint.x - newPoint.x, lastPoint.y - newPoint.y); | |||||
| } | } | ||||
| }; | }; | ||||
| const savePipeline = async (val) => { | const savePipeline = async (val) => { | ||||
| @@ -432,7 +440,7 @@ const EditPipeline = () => { | |||||
| height: graphRef.current.clientHeight || '100%', | height: graphRef.current.clientHeight || '100%', | ||||
| animate: false, | animate: false, | ||||
| groupByTypes: false, | groupByTypes: false, | ||||
| fitView: false, | |||||
| fitView: true, | |||||
| plugins: [contextMenu], | plugins: [contextMenu], | ||||
| enabledStack: true, | enabledStack: true, | ||||
| modes: { | modes: { | ||||