A web interface for vnstat using Chart.js for visuals.
- Automatic light/dark theme
- Colorful graphs
- User-selectable time scales:
- hourly
- daily
- monthly
- yearly
- top days
- Supports any network interface monitored by vnstat
This is a very new project, and as such, there will probably be many breaking changes in the near future. Use the latest tag if you want to deploy this software.
vnstat version 2.x must be configured first. To set up the web interface, simply place the following files in a directory served by your HTTP server:
index.html
style.css
main.js
Chart.min.js
data.php
Note:
data.php
must be run by a PHP interpreter. Simply serving the static content will not work.
The data.php
script will automatically get data from vnstat's JSON output.
Make sure the vnstat
executable is in the PATH
of the PHP interpreter. If
you installed vnstat using a package manager, this should be done
automatically.
Currently, no central configuration/customization location is provided. To
customize the page structure, edit the index.html
and style.css
files. To
customize the behavior of the graphs and data processing, edit the main.js
file, which includes comments to enhance readability.
There shouldn't be much need to edit the data.php
backend, but that's where
the backend code is located if it needs to be changed.