实现固定布局

This commit is contained in:
锦恢 2024-12-24 18:25:55 +08:00
parent b9b05f08fc
commit 2d27298b29
2 changed files with 37 additions and 34 deletions

View File

@ -19,7 +19,6 @@ export class NetlistRender {
this.elkGraph = {
id: 'root',
layoutOptions: {
'elk.algorithm': 'layered',
'elk.progressBar': true,
'layered.nodePlacement.strategy': 'SIDE_BASED'
},
@ -71,7 +70,13 @@ export class NetlistRender {
async createLayout() {
const elk = new ELK();
const graph = this.elkGraph;
const layoutGraph = await elk.layout(graph);
const layoutGraph = await elk.layout(graph, {
layoutOptions: {
'org.eclipse.elk.layered.spacing.nodeNodeBetweenLayers': 35,
'org.eclipse.elk.spacing.nodeNode': 35,
'org.eclipse.elk.layered.layering.strategy': 'LONGEST_PATH'
}
});
console.log(layoutGraph);
return layoutGraph;

View File

@ -142,25 +142,19 @@ export class Module {
const extraOffset = LINE_WIDTH * leftSideConnections.length;
const anchorY = layoutY - targetY;
console.log(targetY, layoutY, targetY - layoutY);
let gap = (targetY - layoutY).toFixed(2);
console.log('gap', gap);
console.log(yOffset);
ports.push({
id: connection.id,
renderName: connection.name,
renderType: 'cellPort',
width: 0,
height: 0,
properties: {
'port.side': ELK_DIRECTION.LEFT,
'port.anchor': `0, ${gap}`
}
width: 1,
height: 1,
x: 0,
y: yOffset
});
console.log(ports.at(-1).properties["port.anchor"]);
}
@ -176,20 +170,20 @@ export class Module {
const extraOffset = LINE_WIDTH * rightSideConnections.length / 2;
const anchorY = targetY - layoutY + extraOffset;
console.log(yOffset);
ports.push({
id: connection.id,
renderName: connection.name,
renderType: 'cellPort',
width: 0,
height: 0,
properties: {
'port.side': ELK_DIRECTION.RIGHT,
'port.anchor': `0, ${anchorY}`
}
width: 1,
height: 1,
x: width,
y: yOffset
});
}
const node = {
id: cell.id,
renderName: cell.type,
@ -198,7 +192,7 @@ export class Module {
height,
ports,
layoutOptions: {
'org.eclipse.elk.portConstraints': 'FIXED_SIDE',
'org.eclipse.elk.portConstraints': 'FIXED_POS'
}
};
nodes.push(node);
@ -217,9 +211,9 @@ export class Module {
renderType: 'cellPort',
width: LAYOUT_CONSTANT.CELL_PORT_WIDTH,
height: LAYOUT_CONSTANT.CELL_PORT_HEIGHT,
properties: {
'port.side': portSide
}
// properties: {
// 'port.side': portSide
// }
})
}
@ -230,10 +224,10 @@ export class Module {
width,
height,
ports,
layoutOptions: {
// 强制固定 port 的方向
'org.eclipse.elk.portConstraints': 'FIXED_SIDE'
}
// layoutOptions: {
// // 强制固定 port 的方向
// 'org.eclipse.elk.portConstraints': 'FIXED_SIDE'
// }
};
nodes.push(node);
@ -299,16 +293,20 @@ export class Module {
if (port.direction === 'input') {
const edge = {
id: makeEdgeId(cellId, port.id),
sources: [port.id],
targets: [connection.id]
source: port.id,
sourcePort: port.id,
target: cell.id,
targetPort: connection.id
};
edges.push(edge);
} else {
const edge = {
id: makeEdgeId(cellId, port.id),
sources: [connection.id],
targets: [port.id]
source: cell.id,
sourcePort: connection.id,
target: port.id,
targetPort: port.id
};
edges.push(edge);