titor/drawDB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix relationship overlap

Browse Source
This commit is contained in:
1ilit 2024-02-20 03:02:17 +02:00
parent d792791394
commit c9a8d76e8e
2 changed files with 36 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Canvas.jsx
View File

@ -440,6 +440,9 @@ export default function Canvas() {
zoom={settings.zoom}
></Area>
))}
{relationships.map((e, i) => (
<Relationship key={i} data={e} />
))}
{tables.map((table) => (
<Table
key={table.id}
@ -467,9 +470,6 @@ export default function Canvas() {
strokeDasharray="8,8"
/>
)}
{relationships.map((e, i) => (
<Relationship key={i} data={e} />
))}
{notes.map((n) => (
<Note
key={n.id}

57
src/utils/index.js
View File

@ -883,16 +883,45 @@ function validateDiagram(diagram) {
}
const calcPath = (x1, x2, y1, y2, startFieldId, endFieldId, zoom = 1) => {
const tableWidth = 200 * zoom;
if (y1 <= y2) {
if (x1 + tableWidth <= x2) {
x2 -= 14;
} else if (x2 <= x1 + tableWidth && x1 <= x2) {
// x2-=14;
// x1-=14;
} else if (x2 + tableWidth >= x1 && x2 + tableWidth <= x1 + tableWidth) {
x1 -= 14;
x2 -= 14;
} else {
x2 -= 14;
x1 -= 14;
}
} else {
if (x1 + tableWidth <= x2) {
x2 -= 14;
} else if (x1 + tableWidth >= x2 && x1 + tableWidth <= x2 + tableWidth) {
//
x1 -= 14;
x2 -= 14;
} else if (x1 >= x2 && x1 <= x2 + tableWidth) {
// x1-=19;
// x2-=14;
} else {
x1 -= 14;
x2 -= 14;
}
}
x1 *= zoom;
x2 *= zoom;
y1 *= zoom;
y2 *= zoom;
const tableWidth = 200 * zoom;
let r = 10 * zoom;
const offsetX = 8 * zoom;
const midX = (x2 + x1 + tableWidth) / 2;
const endX = x2 + tableWidth < x1 ? x2 + tableWidth - offsetX * 2 : x2;
const startTableY = y1 - startFieldId * 36 - 50 - 18;
const endX = x2 + tableWidth < x1 ? x2 + tableWidth : x2;
// const startTableY = y1 - startFieldId * 36 - 50 - 18;
// const endTableY = y2 - endFieldId * 36 - 50;
if (Math.abs(y1 - y2) <= 36 * zoom) {
@ -901,7 +930,7 @@ const calcPath = (x1, x2, y1, y2, startFieldId, endFieldId, zoom = 1) => {
if (x1 + tableWidth <= x2)
return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${x2} ${y2 + 0.1}`;
else if (x2 + tableWidth < x1)
return `M ${x1} ${y1} L ${x2 + tableWidth - 2 * offsetX} ${y2 + 0.1}`;
return `M ${x1} ${y1} L ${x2 + tableWidth} ${y2 + 0.1}`;
}
}
@ -941,32 +970,12 @@ const calcPath = (x1, x2, y1, y2, startFieldId, endFieldId, zoom = 1) => {
y2 + r
} A ${r} ${r} 0 0 1 ${midX + r} ${y2} L ${endX} ${y2}`;
} else if (x1 + tableWidth >= x2 && x1 + tableWidth <= x2 + tableWidth) {
// this for the overlap remember
if (startTableY < y2) {
return `M ${x1} ${y1} L ${x1 - r - r} ${y1} A ${r} ${r} 0 0 1 ${
x1 - r - r - r
} ${y1 - r} L ${x1 - r - r - r} ${y2 + r} A ${r} ${r} 0 0 1 ${
x1 - r - r
} ${y2} L ${x1 - r - 4} ${y2}`;
}
return `M ${x1} ${y1} L ${x1 - r - r} ${y1} A ${r} ${r} 0 0 1 ${
x1 - r - r - r
} ${y1 - r} L ${x1 - r - r - r} ${y2 + r} A ${r} ${r} 0 0 1 ${
x1 - r - r
} ${y2} L ${endX} ${y2}`;
} else if (x1 >= x2 && x1 <= x2 + tableWidth) {
// this for the overlap remember
if (startTableY < y2) {
return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${
x1 + tableWidth - 2 * offsetX + r
} ${y1} A ${r} ${r} 0 0 0 ${x1 + tableWidth - 2 * offsetX + r + r} ${
y1 - r
} L ${x1 + tableWidth - 2 * offsetX + r + r} ${
y2 + r
} A ${r} ${r} 0 0 0 ${x1 + tableWidth - 2 * offsetX + r} ${y2} L ${
x1 + tableWidth - 16
} ${y2}`;
}
return `M ${x1 + tableWidth - 2 * offsetX} ${y1} L ${
x1 + tableWidth - 2 * offsetX + r
} ${y1} A ${r} ${r} 0 0 0 ${x1 + tableWidth - 2 * offsetX + r + r} ${