fix: normalize main flow section to (0,0) origin in frontend
The root cause of the Y-offset: ELK places main flow nodes at arbitrary positions (e.g., y=679) within its root graph, and the frontend rendered them at those raw positions. Handler sections were already normalized via shiftNodes, but the main section was not. Now useDiagramData.ts applies the same normalization to the main section: computes bounding box, shifts nodes and edges so the section starts at (0,0). This fixes the Y-offset regardless of what ELK produces internally. Removed the backend normalizePositions (was ineffective because handler nodes at y=12 dominated the global minimum, preventing meaningful shift of main flow nodes at y=679). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -55,20 +55,30 @@ export function useDiagramData(
|
||||
e => mainNodeIds.has(e.sourceId) && mainNodeIds.has(e.targetId),
|
||||
);
|
||||
|
||||
// Compute main section bounding box
|
||||
// Normalize main section to start at (0, 0) — ELK can place nodes
|
||||
// at arbitrary positions within its root graph
|
||||
const mainBounds = computeBounds(mainNodes);
|
||||
const mainOffX = mainBounds.minX;
|
||||
const mainOffY = mainBounds.minY;
|
||||
const shiftedMainNodes = shiftNodes(mainNodes, mainOffX, mainOffY);
|
||||
const shiftedMainEdges = mainEdges.map(e => ({
|
||||
...e,
|
||||
points: e.points.map(p => [p[0] - mainOffX, p[1] - mainOffY]),
|
||||
}));
|
||||
const mainWidth = mainBounds.maxX - mainBounds.minX;
|
||||
const mainHeight = mainBounds.maxY - mainBounds.minY;
|
||||
|
||||
const sections: DiagramSection[] = [
|
||||
{
|
||||
label: 'Main Route',
|
||||
nodes: mainNodes,
|
||||
edges: mainEdges,
|
||||
nodes: shiftedMainNodes,
|
||||
edges: shiftedMainEdges,
|
||||
offsetY: 0,
|
||||
},
|
||||
];
|
||||
|
||||
let currentY = mainBounds.maxY + SECTION_GAP;
|
||||
let maxWidth = mainBounds.maxX;
|
||||
let currentY = mainHeight + SECTION_GAP;
|
||||
let maxWidth = mainWidth;
|
||||
|
||||
const addHandlerSections = (
|
||||
handlers: { label: string; nodes: DiagramNode[] }[],
|
||||
@@ -106,7 +116,7 @@ export function useDiagramData(
|
||||
// Then error handlers
|
||||
addHandlerSections(errorSections, 'error');
|
||||
|
||||
const totalWidth = Math.max(layout.width ?? 0, mainBounds.maxX, maxWidth);
|
||||
const totalWidth = Math.max(layout.width ?? 0, mainWidth, maxWidth);
|
||||
const totalHeight = currentY;
|
||||
|
||||
return { sections, totalWidth, totalHeight };
|
||||
|
||||
Reference in New Issue
Block a user