RFC8345-based Network Topology Visualizer
Netoviz (Network Topology Visualizer) is a tool to visualize network topology data that based on RFC8345.
See also Netomox (Network topology modeling toolbox), the tool to construct RFC8345 based network topology data.
A live demo (with limited functions) can be viewed at the following URI,
There is netoviz docker container on Docker Hub.
You can run it with docker and use it via http://localhost:3000
.
docker pull netoviz/allinone
docker run -p3000:3000 --name nv-allinone netoviz/allinone
If you change the port number to access it, set -p
option.
docker run -p3005:3000 --name nv-allinone netoviz/allinone
^^^^
Blog
Slide
This application depends on:
This application depends on:
npm install [--legacy-peer-deps]
Currently, Netoviz has gRPC and REST API.
It choose API according to NETOVIZ_API
value (rest
or grpc
).
So it needs gRPC tools to run netoviz with gRPC mode
and docker tools to manipulate docker image of envoy proxy.
Install docker and docker-compose.
sudo apt install docker-ce docker-compose
Install grpc-tools. (grpc_tools_node_protoc
)
sudo npm install -g --unsafe-perm grpc-tools
Download protoc-gen-grpc-web
binary from grpc/grpc-web
and install it.
sudo cp ~/Downloads/protoc-gen-grpc-web-1.0.7-linux-x86_64 /usr/local/bin/protoc-gen-grpc-web
sudo chmod +x /usr/local/bin/protoc-gen-grpc-web
See Dockerfile for netoviz/envoy and docker-compose config.
Copy dot.env
to .env
and edit environment variables.
cp dot.env .env
# edit NETOVIZ_GRPC_HOST to set gRPC server host/address for envoy proxy
# vi .env
Check parameters.
docker-compose config
Build envoy docker image for netoviz.
docker-compose build
Netoviz has REST and gRPC API.
Its frontend application and backend server changes API to communicate each other by value of NETOVIZ_API
.
You can change (override) the API to use by the variable at run-time like that:
NETOVIZ_API=grpc npm run (dev|start)
NETOVIZ_API=rest
(default): frontend (client) and backend (server) use only REST.NETOVIZ_API=grpc
: frontend (client) and backend (server) use REST and gRPC.
npm run dev
Build (compile and minify) script for production,
npm run build
and run the application.
npm run start
Run envoy container to proxy grpc-web request.
docker-compose up
Build all-in-one container. (See detail: Dockerfile for all-in-one container. NOTICE: It copies current sources/packages and rebuild netoviz.)
docker build -t netoviz/allinone .
# or
npm run docker-build
Run.
docker run -p3000:3000 --name nv-allinone netoviz/allinone
It can run with gRPC API (port 9090 is for gRPC) with environment variable NETOVIZ_API=grpc
.
Then, it need envoy proxy to use gRPC-web.
# build and run envoy proxy at first.
docker run -p3000:3000 -p9090:9090 --env NETOVIZ_API=grpc --name nv-allinone netoviz/allinone
Debug.
docker run -it netoviz/allinone /bin/sh
Generate documents with JSDoc.
npm run doc
fig/
: UML class diagram
lib/diagram
: Visualizer libraryserver/graph
: RFC8345 data model and data convert librarystatic/model
: Topology data files (json)
server
: API ServerApplication (see pages)
/
/model[/:modelFile]
/visualizer[/:visualizer]
/model/:modelFile/:visualizer
/visualizer/:visualizer/:modelFile
Server (JSON API) (see server/api.js)
/api/models
(return topology model list)/api/graph/:graphName/:jsonName
/api/graph/:graphName/:jsonName
Compile protocol buffer. (It can run with npm run protoc
.)
hagiwara@dev01:~/nwmodel/netoviz/server/graph-api/grpc$ grpc_tools_node_protoc \
--js_out=import_style=commonjs,binary:. \
--grpc-web_out=import_style=commonjs,mode=grpcwebtext:. \
--grpc_out=. \
topology-data.proto
Run test-server (returns dummy data)
hagiwara@dev01:~/nwmodel/netoviz/$ node bin/grpc-server.js
Run test-client (CLI-client)
# PWD: ~/nwmodel/netoviz/
# Arguments: graph <graph_name> <json>
node bin/grpc-client.js graph force_simulation nlink_check.json
# Arguments: graph <number>
node bin/grpc-client.js alerts 3
prettier
npm run format
eslint
npm run lint
npm run lint:fix