前言

我之前的一篇博客，里面给了一个自定义css。用在哪吒v1中，切换展示卡片为横向时，流量显示会有乱码，NodeSeek ziwiwiz大佬 分享了新的js代码，按照大佬分享的，我进行了隐藏服务中流量监控进行二改。

给哪吒添加周期流量进度条

转自：哪吒V1探针 周期性流量进度条显示分享

配置流量进度的前提

发现大部分人不了解周期性流量的统计，需要针对机器配置对应统计周期，统计方式，流量总量信息。
可以参考https://nezha.wiki/guide/q6.html 配置, 使用 https://nzcfg.pages.dev/ 进行配置告警信息

后台美化配置

直接把js代码放入哪吒后台的自定义代码中即可

隐藏服务中流量监控版

<script src="https://cdn.jsdelivr.net/gh/leuxinovo/nezha-ui@main/traffic-display.js"></script>

不隐藏服务中流量监控版

<script src="https://cdn.jsdelivr.net/gh/leuxinovo/nezha-ui@main/traffic-display2.js"></script>

美化字体

<script src="https://cdn.jsdelivr.net/gh/leuxinovo/nezha-ui@main/font-inject.js"></script>