# Network Switch User Interface

**URL:** <https://forum.inductiveautomation.com/t/network-switch-user-interface/108202>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [July 7, 2025, 8:45pm UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202 "2025-07-07T20:45:14Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Alex\_Rayburg](https://avatars.discourse-cdn.com/v4/letter/a/ee59a6/32.png) [@Alex\_Rayburg](https://forum.inductiveautomation.com/u/Alex_Rayburg)\
**Post date:** [July 7, 2025, 8:45pm UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202/1 "2025-07-07T20:45:14Z")

</div>

Hello,

I am planning to recreate the image below in ignition perspective. I am thinking of trying to use pipes to accomplish it.

One thing I really want is to be able to click on each link, and I noticed that the pipes themselves cant have events binded to them, but the xy container can have a binding for "pipe clicks". Is there a way to return what pipe is clicked? Or do I need a unique xy container for each pipe segment.

Thank you for your advice in advance!

 ![Screenshot 2025-07-01 083156](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/3/83c0271a606ecbd1ca44f2d960b33bd365d837e3.png)

---

<div class="post-metadata">

**Author:** ![robertm](https://avatars.discourse-cdn.com/v4/letter/r/ea5d25/32.png) [@robertm](https://forum.inductiveautomation.com/u/robertm)\
**Post date:** [July 7, 2025, 9:10pm UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202/2 "2025-07-07T21:10:22Z")

</div>

Seems like a perfect application for Naders flow/node editor:

> [@vCortex (i4Cortex Visualization Component Pack)](https://forum.inductiveautomation.com/t/vcortex-i4cortex-visualization-component-pack/100186):
>
> vCortex (i4Cortex Visualization Component Pack) We are happy to announce the release of our first module vCortex, an Ignition module that adds a collection of components to the Perspective Module. We invite everyone to test it, explore its features, and report any bugs or feedback to help us improve it. You can [download the demo module as a Public Beta here](https://i4cortex.com/product/vcortex-visual-component/) The module will not be limited to the current number of components and will grow based on community requests. Current Components: • Ri…

---

<div class="post-metadata">

**Author:** ![Alex\_Rayburg](https://avatars.discourse-cdn.com/v4/letter/a/ee59a6/32.png) [@Alex\_Rayburg](https://forum.inductiveautomation.com/u/Alex_Rayburg)\
**Post date:** [July 7, 2025, 9:11pm UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202/3 "2025-07-07T21:11:24Z")

</div>

Update: using "event.pipeIndex" I am able to get info on the exact pipe I clicked. Still would like to know if you experts would use pipes in this situation. Thank you

---

<div class="post-metadata">

**Author:** ![Alex\_Rayburg](https://avatars.discourse-cdn.com/v4/letter/a/ee59a6/32.png) [@Alex\_Rayburg](https://forum.inductiveautomation.com/u/Alex_Rayburg)\
**Post date:** [July 7, 2025, 9:14pm UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202/4 "2025-07-07T21:14:09Z")

</div>

I will investigate, thank you for your feedback!

---

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [July 7, 2025, 11:16pm UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202/5 "2025-07-07T23:16:33Z")

</div>

With the Flow diagram component, each line can be recreated by edge, each edge has unique id and clicking on edges we have edge on click event. Just noted, for each device you need to create a node(embedded view) with some handles to connect the lines. The trick here is to setup handle position so they overlay the ProfiNet port in your graphic. Just checkout the playground project, P&ID editor view to get beter idea.  
After you finish your drawing you can disable edit mode in props.interaction so your user can't move devices in runtime.  
Eventually you can enjoy zoom and pan with the result.

---

<div class="post-metadata">

**Author:** ![robertm](https://avatars.discourse-cdn.com/v4/letter/r/ea5d25/32.png) [@robertm](https://forum.inductiveautomation.com/u/robertm)\
**Post date:** [July 7, 2025, 11:53pm UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202/6 "2025-07-07T23:53:07Z")

</div>

I wish there was a vision version. I have a lot of p&ids that I drew by hand...even now, I would take the time to redraw as your presentation is so clean. I do high performance HMI standards, so P&IDs typically get buried to the 3rd level of nav, but even still, this presentation would be very helpful, IMO. Hand drawing interconnects to devices and not being able to drag them around is too tedious.

---

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [July 8, 2025, 12:22am UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202/7 "2025-07-08T00:22:43Z")

</div>

In any case P&ID drawing is painful for everyone specially when your diagram is so big.  
Here is a sample in flow diagram.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/1/4184625ca9a5af3948590fcdf50db1b6e21cb690.png)

[Network Diagram.zip](https://forum.inductiveautomation.com/uploads/short-url/r4NpzJOHzP6XF844m5saT6cBEuI.zip) (71.4 KB)

---

<div class="post-metadata">

**Author:** ![robertm](https://avatars.discourse-cdn.com/v4/letter/r/ea5d25/32.png) [@robertm](https://forum.inductiveautomation.com/u/robertm)\
**Post date:** [July 8, 2025, 12:29am UTC](https://forum.inductiveautomation.com/t/network-switch-user-interface/108202/8 "2025-07-08T00:29:26Z")

</div>

My P&IDs are compartmentalized, but the current plant I'm doing has roughly 100 seperate D size drawings, and thats not including the line drive or finished product packaging.

Nice work on the network visualization. Would be a no brainer if I were working in perspective. I still watch your YouTube videos to get ideas for my vision presentations.
