From 180adb42a391e288787dcb13022ebebae193b79e Mon Sep 17 00:00:00 2001
From: jeremystretch <jstretch@ns1.com>
Date: Wed, 8 Jun 2022 16:29:26 -0400
Subject: [PATCH] Use polylines to draw cable fanouts

---
 netbox/dcim/svg/cables.py                     |  23 +++++++++++++-----
 netbox/project-static/dist/cable_trace.css    | Bin 1133 -> 1169 bytes
 netbox/project-static/styles/cable-trace.scss |   6 ++++-
 3 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/netbox/dcim/svg/cables.py b/netbox/dcim/svg/cables.py
index 34a171e00..3a9b47b54 100644
--- a/netbox/dcim/svg/cables.py
+++ b/netbox/dcim/svg/cables.py
@@ -1,6 +1,6 @@
 import svgwrite
 from svgwrite.container import Group, Hyperlink
-from svgwrite.shapes import Line, Rect
+from svgwrite.shapes import Line, Polyline, Rect
 from svgwrite.text import Text
 
 from django.conf import settings
@@ -16,7 +16,8 @@ __all__ = (
 OFFSET = 0.5
 PADDING = 10
 LINE_HEIGHT = 20
-FANOUT_HEIGHT = 25
+FANOUT_HEIGHT = 35
+FANOUT_LEG_HEIGHT = 15
 TERMINATION_WIDTH = 100
 
 
@@ -213,15 +214,25 @@ class CableTraceSVG:
         return nodes
 
     def draw_fanin(self, node, connector):
+        points = (
+            node.bottom_center,
+            (node.bottom_center[0], node.bottom_center[1] + FANOUT_LEG_HEIGHT),
+            connector.start,
+        )
         self.connectors.extend((
-            Line(start=node.bottom_center, end=connector.start, class_='cable-shadow'),
-            Line(start=node.bottom_center, end=connector.start, style=f'stroke: #{connector.color}'),
+            Polyline(points=points, class_='cable-shadow'),
+            Polyline(points=points, style=f'stroke: #{connector.color}'),
         ))
 
     def draw_fanout(self, node, connector):
+        points = (
+            connector.end,
+            (node.top_center[0], node.top_center[1] - FANOUT_LEG_HEIGHT),
+            node.top_center,
+        )
         self.connectors.extend((
-            Line(start=connector.end, end=node.top_center, class_='cable-shadow'),
-            Line(start=connector.end, end=node.top_center, style=f'stroke: #{connector.color}')
+            Polyline(points=points, class_='cable-shadow'),
+            Polyline(points=points, style=f'stroke: #{connector.color}'),
         ))
 
     def draw_cable(self, cable):
diff --git a/netbox/project-static/dist/cable_trace.css b/netbox/project-static/dist/cable_trace.css
index 50622f1284d056b81de5e643b27c1fa1d8487cdc..ff431f4ad848f1fe4c93892c9cbe87e608d78d34 100644
GIT binary patch
delta 52
zcmaFMF_CjaKC?zaeokdhW?pJ_T4qj;RbGBxs&#QmQGRx+Zh2-(NrshaK}BtGS-QgH
HV&-1}A7~W0

delta 16
XcmbQp`IcitJ~K;BW?t&#>CC?XG${s!

diff --git a/netbox/project-static/styles/cable-trace.scss b/netbox/project-static/styles/cable-trace.scss
index 51d94d38a..59c67ad4d 100644
--- a/netbox/project-static/styles/cable-trace.scss
+++ b/netbox/project-static/styles/cable-trace.scss
@@ -55,7 +55,11 @@ svg {
   line {
     stroke-width: 5px;
   }
-  line.cable-shadow {
+  polyline {
+    fill: none;
+    stroke-width: 5px;
+  }
+  .cable-shadow {
     stroke: var(--nbx-trace-cable-shadow);
     stroke-width: 7px;
   }