diff --git a/packages/mindplot/src/components/ConnectionLine.ts b/packages/mindplot/src/components/ConnectionLine.ts index 9775bcf1..efcc481c 100644 --- a/packages/mindplot/src/components/ConnectionLine.ts +++ b/packages/mindplot/src/components/ConnectionLine.ts @@ -51,17 +51,10 @@ class ConnectionLine { this._targetTopic = targetNode; this._sourceTopic = sourceNode; - let line: Line; const ctrlPoints = this._getCtrlPoints(sourceNode, targetNode); - if (targetNode.getType() === 'CentralTopic') { - line = this._createLine(LineType.CURVED); - line.setSrcControlPoint(ctrlPoints[0]); - line.setDestControlPoint(ctrlPoints[1]); - } else { - line = this._createLine(LineType.SIMPLE_CURVED); - line.setSrcControlPoint(ctrlPoints[0]); - line.setDestControlPoint(ctrlPoints[1]); - } + const line = this._createLine(LineType.SIMPLE_CURVED); + line.setSrcControlPoint(ctrlPoints[0]); + line.setDestControlPoint(ctrlPoints[1]); // Set line styles ... const strokeColor = ConnectionLine.getStrokeColor(); line.setStroke(1, 'solid', strokeColor, 1); diff --git a/packages/web2d/src/components/peer/svg/CurvedLinePeer.js b/packages/web2d/src/components/peer/svg/CurvedLinePeer.js index 87a535a6..fd9ab141 100644 --- a/packages/web2d/src/components/peer/svg/CurvedLinePeer.js +++ b/packages/web2d/src/components/peer/svg/CurvedLinePeer.js @@ -149,26 +149,23 @@ class CurvedLinePeer extends ElementPeer { if ($defined(this._x1) && $defined(this._y1) && $defined(this._x2) && $defined(this._y2)) { this._calculateAutoControlPoints(avoidControlPointFix); - const path = `M${this._x1.toFixed(2)},${this._y1.toFixed()} C${( - this._control1.x + this._x1 - ).toFixed(2)},${this._control1.y + this._y1} ${(this._control2.x + this._x2).toFixed()},${( - this._control2.y + this._y2 - ).toFixed(2)} ${this._x2.toFixed(2)},${this._y2.toFixed()}${this._lineStyle - ? ` ${(this._control2.x + this._x2).toFixed()},${( - this._control2.y + - this._y2 + - 3 - ).toFixed(2)} ${(this._control1.x + this._x1).toFixed()},${( - this._control1.y + - this._y1 + - 5 - ).toFixed(2)} ${this._x1.toFixed(2)},${(this._y1 + 7).toFixed(2)} Z` - : '' - }`; + const moveTo = CurvedLinePeer._pointToStr(this._x1, this._y1); + const curveP1 = CurvedLinePeer._pointToStr(this._control1.x + this._x1, this._control1.y + this._y1); + const curveP2 = CurvedLinePeer._pointToStr(this._control2.x + this._x2, this._control2.y + this._y2); + const curveP3 = CurvedLinePeer._pointToStr(this._x2, this._y2); + const curveP4 = CurvedLinePeer._pointToStr(this._control2.x + this._x2, this._control2.y + this._y2 + 3); + const curveP5 = CurvedLinePeer._pointToStr(this._control1.x + this._x1, this._control1.y + this._y1 + 5); + const curveP6 = CurvedLinePeer._pointToStr(this._x1, this._y1 + 7); + + const path = `M${moveTo} C${curveP1} ${curveP2} ${curveP3} ${this._lineStyle ? ` ${curveP4} ${curveP5} ${curveP6} Z` : ''}`; this._native.setAttribute('d', path); } } + static _pointToStr(x, y) { + return `${(x).toFixed(3)},${(y).toFixed(3)} `; + } + _updateStyle() { let style = ''; for (const key in this._style) {