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

fix line direction while maintaining smoothening

Browse Source
This commit is contained in:
Srinivas2794
2019-05-26 18:26:04 +05:30
parent a95010652d
commit a289c73b68
2 changed files with 12 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/Toolkit.ts
View File

@@ -45,8 +45,18 @@ export class Toolkit {
public static generateCurvePath(firstPoint: PointModel, lastPoint: PointModel, curvy: number = 0): string {
var isHorizontal = Math.abs(firstPoint.x - lastPoint.x) > Math.abs(firstPoint.y - lastPoint.y);
var curvyX = isHorizontal ? curvy : 0;
var curvyY = isHorizontal ? 0 : curvy;
var xOrY = isHorizontal ? "x" : "y";
// make sure that smoothening works
// without disrupting the line direction
let curvyness = curvy;
if (firstPoint[xOrY] > firstPoint[xOrY]) {
curvyness = -curvy;
}
var curvyX = isHorizontal ? curvyness : 0;
var curvyY = isHorizontal ? 0 : curvyness;
return `M${firstPoint.x},${firstPoint.y} C ${firstPoint.x + curvyX},${firstPoint.y + curvyY}
${lastPoint.x - curvyX},${lastPoint.y - curvyY} ${lastPoint.x},${lastPoint.y}`;

7
src/defaults/widgets/DefaultLinkWidget.tsx
View File

@@ -318,13 +318,6 @@ export class DefaultLinkWidget extends BaseWidget<DefaultLinkProps, DefaultLinkS
var pointLeft = points[0];
var pointRight = points[1];
//some defensive programming to make sure the smoothing is
//always in the right direction
if (pointLeft[xOrY] > pointRight[xOrY]) {
pointLeft = points[1];
pointRight = points[0];
}
paths.push(
this.generateLink(
Toolkit.generateCurvePath(pointLeft, pointRight, this.props.link.curvyness),