javascript/react-diagrams
1
0
Fork 0
mirror of https://github.com/projectstorm/react-diagrams.git synced 2026-03-13 09:50:09 +08:00
Code Issues Packages Projects Releases Wiki Activity

improved new links to have better experience

Browse Source
This commit is contained in:
Daniel Lazar
2019-08-29 13:49:28 +02:00
parent 0deaec246d
commit f20bb0bd2e
1 changed files with 10 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
packages/react-diagrams-routing/src/link/RightAngleLinkWidget.tsx
View File

@@ -191,25 +191,30 @@ export class RightAngleLinkWidget extends React.Component<RightAngleLinkProps, R
// Get points based on link orientation
let pointLeft = points[0];
let pointRight = points[points.length - 1];
let hadToSwitch = false;
if (pointLeft.getX() > pointRight.getX()) {
pointLeft = points[points.length - 1];
pointRight = points[0];
hadToSwitch = true;
}
let dy = Math.abs(points[0].getY() - points[points.length - 1].getY());
// When new link add one middle point to get everywhere 90° angle
if (this.props.link.getTargetPort() === null && points.length === 2) {
this.props.link.addPoint(
new PointModel({
[...Array(2)].forEach(item => {
this.props.link.addPoint(new PointModel({
link: this.props.link,
position: new Point(pointLeft.getX(), pointRight.getY())
}),
1
}), 1);
});
);
}
// When new link is moving and not connected to target port move with middle point
else if (this.props.link.getTargetPort() === null) {
points[1].setPosition(pointLeft.getX(), pointRight.getY());
points[1].setPosition(pointRight.getX() + (pointLeft.getX() - pointRight.getX())/2,
!hadToSwitch ? pointLeft.getY() : pointRight.getY());
points[2].setPosition(pointRight.getX() + (pointLeft.getX() - pointRight.getX())/2,
!hadToSwitch ? pointRight.getY() : pointLeft.getY());
}
// Render was called but link is not moved but user.
// Node is moved and in this case fix coordinates to get 90° angle.