https://www.eurobot.es/wp-content/plugins/eurobotspain-admin-tools…/bracket/assets/js/utils/bracketSvgUtils.js

1export function createSvgPath(svg, x1, y1, x2, y2) {
2
3    const path = document.createElementNS(
4        'http://www.w3.org/2000/svg',
5        'path'
6    );
7
8    const midX = (x1 + x2) / 2;
9
10    const d = `
11        M ${x1} ${y1}
12        L ${midX} ${y1}
13        L ${midX} ${y2}
14        L ${x2} ${y2}
15    `;
16
17    path.setAttribute('d', d.trim());
18    path.classList.add('bracket-line');
19
20    svg.appendChild(path);
21}
22
23export function createConnection(svg, A, B, C) {
24
25    const path = document.createElementNS(
26        'http://www.w3.org/2000/svg',
27        'path'
28    );
29
30    const midX1 = A.x + 30;
31    const midX2 = C.x - 30;
32    const midY = (A.y + B.y) / 2;
33
34    const d = `
35        M ${A.x} ${A.y}
36        L ${midX1} ${A.y}
37
38        L ${midX1} ${midY}
39
40        L ${midX2} ${midY}
41
42        L ${midX2} ${C.y}
43
44        L ${C.x} ${C.y}
45
46        M ${B.x} ${B.y}
47        L ${midX1} ${B.y}
48        L ${midX1} ${midY}
49    `;
50
51    path.setAttribute('d', d.trim());
52    path.classList.add('bracket-line');
53
54    svg.appendChild(path);
55}