How do you visualize a network/infrastructure?

darksmile92 profile image Robin Kretzschmar ・1 min read

I have a network on a client side containing workstations, routers, servers, printers, VoIP-phones and other devices.

I want to:

  • see all devices with details (maybe click to view more) > Name, IP
  • see connections between the devices (Printer > Workstation, Router > Workstation)
  • be able to interact with the map (just nice to have)

My first attempt was to list every entity in a json file and create a website with D3.js. This gave me the ability to have a nice visualization and see some details along with it. But having to maintain connection properties between devices in a json file is not very comfortable.

How would you recommend to start visualizing the infrastructure?

Posted on by:

darksmile92 profile

Robin Kretzschmar


Started coding at the age of 13, now a professional software engineer creating and maintaining enterprise solutions. Eat - Sleep - Code - Lift - Repeat 💪🏾


markdown guide

Simple answer: Then, don't use JSON. It's trivial to parse a different file format (YAML, XML, fixed width, CSV, etc...). Just generate/edit the data in whatever format is easy to manage and then parse it into something appropriate to visualize. It may even make sense to autogenerate some data (e.g. IP addresses, etc...) that can be retrieved via a script and then have a separate file for manually entered data. Two files may be annoying, but force fitting one format for multiple purposes/sources can be worse.

Think LEGO. It's easy to assemble, it's harder to break down a monolith. For that matter, there's no good reason to have a single file... have a single file per node and then a list of files and then retrieve each file individually. Potentially easier to manage via a source control tool or a DB too.


Thank you for the input, the approach with a database seems quite good for this scenario. Do you also have something in mind to visualize it then? (Somewhat other than D3js :-) )