The purpose of this package is to view and visualize vda5050 messages more quickly without looking at the json data. After running the application, you need to press the start button.

• Displaying the real-time position of multiple robots
• Displaying the vda5050 actions that robots perform
• Displaying data from the master controller to the robot and from the robot to the master controller
• Display of raw json data

• Actions are listing on the path
• Action nodes and edges color are changing

Check out the live demo of this project here.

Before than run app, please go to folder and install npm packages

npm install 

npm run dev

Note Modern web browsers (google chrome, firefox, opera etc.) cannot access the mqtt protocol directly. Therefore, if you want to use this application, please first enable the use of web sockets in your mqtt broker settings

sudo nano /etc/mosquitto/mosquitto.conf

per_listener_settings true
listener 1883
allow_anonymous true

listener 14520
protocol websockets
allow_anonymous true

Building docker container for development.

docker build -t vda-visualizer:dev -f Dockerfile.dev .

Run docker container

docker run -p 8080:8080 -v $(pwd):/app -v /app/node_modules --rm vda-visualizer:dev

Building docker container for production

docker build -t vda-visualizer:prod -f Dockerfile.prod .

Run docker container

docker run -p 4173:4173 --rm vda-visualizer:prod