Add connection popup to XML export

[snatch2013]

NetBox version

v3.7.8

Topology Views version

v3.9.1

Feature type

Change to existing functionality

Proposed functionality

Modify the XML export logic of the Topology Views plugin to include source and destination port/interface details for each link.

When imported into draw.io, each connection line should display the corresponding interface names as a label or text annotation.

Ideally, the label should follow a consistent format, such as:
DeviceA:Ethernet1/1 ⇄ DeviceB:Ethernet1/2 or optionally just show the local interface name on each end of the connection (depending on draw.io limitations and user preferences).

Implementation on the XML side:

In addition to the vertex mxCell object, for example this one:
<mxCell id="JL38dpjvp8IfbgFrF-6G-22" style="rounded=0;orthogonalLoop=1; jettySize=auto; html=1; endArrow=none; endFill=0; strokeColor=#2b7ce9; shadow=0; flowAnimation=0; curved=0;" parent="1" source="JL37dpjvp8IfbgFrF-6G-59" target="JL38dpjvp8IfbgFrF-6G-47" edge="1"><mxGeometry relative="1" as="geometry"/></mxCell>

We need an additional vertex with a parent value equal to the id of the connection vertex, the connectable value 0
<mxCell id="q4FAq0egT-oxusbm8v2G-1" value="Switch1:port1<div>Switch2:port3</div>" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];textShadow=1;" vertex="1" connectable="0" parent="JL38dpjvp8IfbgFrF-6G-22"> <mxGeometry x="0.0117" y="-3" relative="1" as="geometry"> <mxPoint as="offset"/> </mxGeometry> </mxCell>

Optional Considerations:

• Allow toggling this feature on or off during export, via a checkbox or setting (e.g., "Include port/interface names").
• Provide an option to show either full interface names or abbreviated versions (e.g., Gi0/1 instead of GigabitEthernet0/1).

Use case

Overview:

Currently, the NetBox Topology Views plugin allows users to export topology diagrams to an XML format compatible with draw.io. However, the exported connections between devices lack detailed port/interface information. This feature request proposes enhancing the XML export functionality to include port/interface names as part of the connection labels in the resulting diagram.

Benefits:

• Improves the clarity and usefulness of topology diagrams by providing critical interface-level details directly within the visual representation.
• Saves time for network engineers by reducing the need to cross-reference interface mappings separately.
• Enhances documentation accuracy and facilitates troubleshooting and planning.

External dependencies

No response

[dreng]

Personally I don't see why an export should be different from the view that is being exported. So, the proposal should rather be like "add port information to the connections between nodes" - without the XML limitation. That said, we've had a few discussions about that before. The idea isn't bad per se, but it doesn't scale. It would be helpful for sure to have a label on an edge if there's just one connected between devices. If you have a lot of connections between two devices (e.g. a switch and a patch panel) the display would be a complete mess.

[dreng]

Just to clarify: I created a mockup from a real calculation. This is what vis-network does when you put a label on every edge:

The best result I got was this. Unfortunately it depends on the angle and distance of the two nodes to each other (so that's a bit of a coincidence):

[snatch2013]

Just to clarify: I created a mockup from a real calculation. This is what vis-network does when you put a label on every edge:

Hello,

I have created the feature request, meaning this export will be used for draw.io. When we develop schemes in draw.io, we usually have labels on links. Of course, if you have so many links between the two nodes, it can be a mess, so in draw.io I think it is easier to improve since we can move nodes and links there as we want, that's not the same as an auto-generated scheme by viz.

So that's how it looks in draw.io

[lassek]

@snatch2013 have you checked my 'solution' here in the duplicate? The info is already available in the 'title', it just need to get written into the export: #614 (comment)
The problem is not only with multiple connections on top of each other, but also with the order of the label: the reference of port to device. Depending on the direction you created your cable it would be Ge <> Te or Te <> Ge in your example.

Personally I don't see why an export should be different from the view that is being exported.

@dreng I'm with you on that, so would you think the feature should first focus on 'display multiple connections between 2 nodes as straight lines next to each other' (up to a limit) and then on labeling them?
Maybe even with a port label on the line near the node.
Those curved lines look nice, but they are not in an export.

[snatch2013]

@snatch2013 have you checked my 'solution' here in the duplicate? The info is already available in the 'title', it just need to get written into the export: #614 (comment) The problem is not only with multiple connections on top of each other, but also with the order of the label: the reference of port to device. Depending on the direction you created your cable it would be Ge <> Te or Te <> Ge in your example.

I think maybe I didn't explain clearly what I requested, so nobody understood me :) As I understand, you are discussing some changes for the current topology generated by the plugin which is shown in netbox. But my request is about a different thing.

In the topology generated in netbox we have a tooltip for the links which shows the information about source device:source port -> destination device : destination port. We have it in topology, it is great, I like it. But, when we make an export to XML, this information is lost. So, my request is just to keep this information in the XML export, so then it can be used for example in draw.io.

I just proposed in which way we can add this information to the XML file. Though now I think maybe label is not the correct way, and better to use a tooltip, so then in draw.io it will be the same as in the topology generated in netbox.

[lassek]

@snatch2013 please check what I wrote there in my linked comment, it is exactly what you want and what you are describing
the 'label information text' is stored in the 'title' field and my changes to the code will export exactly that information into the xml.
I personally then run a text replace script over the xml file to change some colors and port descriptions (in netbox I have the intarfaces as their long names, in xml/draw.io I want them shorter)

[dreng]

I've changed the title in order reflect the indended proposal.

So, the following needs to be done in the export function: Get the connection information (like it can be seen in the tooltip) of each connection (aka cable) and create either a connection text or a seperate rectangle with the connection information.

Any volunteers?