目录
- 专栏导读
- 背景介绍
- 项目效果预览
- 库的安装
- 代码解析
-
- 1. 初始化应用和数据
- 2. 创建仪表盘布局
- 3. 实时更新数据
- 4. 创建图表
- 如何运行
- 完整代码
- 总结
专栏导读
-
欢迎来到Python办公自动化专栏—Python处理办公问题，解放您的双手
-
️ 博客主页：请点击——> 一晌小贪欢的博客主页求关注
-
该系列文章专栏：请点击——>Python办公自动化专栏求订阅
-
此外还有爬虫专栏：请点击——>Python爬虫基础专栏求订阅
-
此外还有python基础专栏：请点击——>Python基础学习专栏求订阅
-
文章作者技术和水平有限，如果文中出现错误，希望大家能指正
-
❤️ 欢迎各位佬关注！ ❤️
背景介绍
-
大家好！今天我们要用Python打造一个超酷的系统资源监控仪表盘，实时显示你的电脑CPU、内存、磁盘和网络使用情况。这个项目不仅实用，而且视觉效果非常炫酷，特别适合放在副屏上实时监控电脑状态！
项目效果预览
这个仪表盘会实时显示：
-
CPU使用率曲线
-
内存占用百分比
-
磁盘使用情况
-
网络上传下载流量
库的安装
我们需要用到以下几个Python库：
-
dash：用于构建交互式Web仪表盘
-
plotly：创建漂亮的动态图表
-
psutil：获取系统资源使用信息
| 库 |
用途 |
安装 |
| dash |
构建交互式Web仪表盘 |
pip install dash -i https://pypi.tuna.tsinghua.edu.cn/simple/ |
| plotly |
创建漂亮的动态图表 |
pip install plotly -i https://pypi.tuna.tsinghua.edu.cn/simple/ |
| psutil |
获取系统资源使用信息 |
pip install psutil -i https://pypi.tuna.tsinghua.edu.cn/simple/ |
代码解析
让我们一步步来看这个项目的核心代码：
1. 初始化应用和数据
-
这里我们初始化了Dash应用，并创建了存储各种指标的列表。网络数据转换为MB单位以便于阅读。
import dash
from dash import dcc, html
from dash.dependencies import Output, Input
import plotly.graph_objs as go
import psutil
import datetime
app = dash.Dash(__name__)
app.title = "计算器资源占用率可视化"
X = [datetime.datetime.now()]
cpu = [psutil.cpu_percent()]
mem = [psutil.virtual_memory().percent]
disk = [psutil.disk_usage('/').percent]
net_sent = [psutil.net_io_counters().bytes_sent / 1024 / 1024]
net_recv = [psutil.net_io_counters().bytes_recv / 1024 / 1024]
2. 创建仪表盘布局
-
我们设置了黑色背景(#111)和白色文字的整体风格，创建了四个图表区域和一个每秒触发一次的定时器。
app.layout = html.Div(style={'backgroundColor': '#111', 'color': '#fff', 'padding': '10px'}, children=[
html.H1("计算器占用率动态可视化", style={'textAlign': 'center'}),
dcc.Graph(id='cpu-graph'),
dcc.Graph(id='mem-graph'),
dcc.Graph(id='disk-graph'),
dcc.Graph(id='net-graph'),
dcc.Interval(id='interval', interval=1000, n_intervals=0)
])
3. 实时更新数据
-
这个回调函数每秒执行一次，获取最新的系统数据并更新图表。我们限制只保留最近60个数据点，避免图表过于拥挤。
@app.callback(
Output('cpu-graph', 'figure'),
Output('mem-graph', 'figure'),
Output('disk-graph', 'figure'),
Output('net-graph', 'figure'),
Input('interval', 'n_intervals')
)
def update_metrics(n):
global X, cpu, mem, disk, net_sent, net_recv
now = datetime.datetime.now()
X.append(now)
cpu.append(psutil.cpu_percent())
mem.append(psutil.virtual_memory().percent)
disk.append(psutil.disk_usage('/').percent)
net_sent.append(psutil.net_io_counters().bytes_sent / 1024 / 1024)
net_recv.append(psutil.net_io_counters().bytes_recv / 1024 / 1024)
X = X[-60:]
cpu = cpu[-60:]
mem = mem[-60:]
disk = disk[-60:]
net_sent = net_sent[-60:]
net_recv = net_recv[-60:]
4. 创建图表
-
这里我们为每个指标创建了不同颜色的曲线图，保持统一的暗黑风格界面。
return (
go.Figure(data=[go.Scatter(x=X, y=cpu, mode='lines+markers', line=dict(color='cyan'))],
layout=go.Layout(title='CPU 使用率 (%)', paper_bgcolor='#111', plot_bgcolor='#222', font=dict(color='#fff'))),
go.Figure(data=[go.Scatter(x=X, y=mem, mode='lines+markers', line=dict(color='lime'))],
layout=go.Layout(title='内存 使用率 (%)', paper_bgcolor='#111', plot_bgcolor='#222', font=dict(color='#fff'))),
go.Figure(data=[go.Scatter(x=X, y=disk, mode='lines+markers', line=dict(color='orange'))],
layout=go.Layout(title='磁盘 使用率 (%)', paper_bgcolor='#111', plot_bgcolor='#222', font=dict(color='#fff'))),
go.Figure(data=[
go.Scatter(x=X, y=net_sent, mode='lines', name='发送 MB', line=dict(color='magenta')),
go.Scatter(x=X, y=net_recv, mode='lines', name='接收 MB', line=dict(color='aqua')),
], layout=go.Layout(title='网络传输 (MB)', paper_bgcolor='#111', plot_bgcolor='#222', font=dict(color='#fff')))
)
如何运行
python monitor.py
-
打开浏览器访问 http://127.0.0.1:8050/ 就能看到实时监控仪表盘了！
完整代码
import dash
from dash import dcc, html
from dash.dependencies import Output, Input
import plotly.graph_objs as go
import psutil
import datetime
app = dash.Dash(__name__)
app.title = "计算器资源占用率可视化"
X = [datetime.datetime.now()]
cpu = [psutil.cpu_percent()]
mem = [psutil.virtual_memory().percent]
disk = [psutil.disk_usage('/').percent]
net_sent = [psutil.net_io_counters().bytes_sent / 1024 / 1024]
net_recv = [psutil.net_io_counters().bytes_recv / 1024 / 1024]
app.layout = html.Div(style={'backgroundColor': '#111', 'color': '#fff', 'padding': '10px'}, children=[
html.H1("计算器占用率动态可视化", style={'textAlign': 'center'}),
dcc.Graph(id='cpu-graph'),
dcc.Graph(id='mem-graph'),
dcc.Graph(id='disk-graph'),
dcc.Graph(id='net-graph'),
dcc.Interval(id='interval', interval=1000, n_intervals=0)
])
@app.callback(
Output('cpu-graph', 'figure'),
Output('mem-graph', 'figure'),
Output('disk-graph', 'figure'),
Output('net-graph', 'figure'),
Input('interval', 'n_intervals')
)
def update_metrics(n):
global X, cpu, mem, disk, net_sent, net_recv
now = datetime.datetime.now()
X.append(now)
cpu.append(psutil.cpu_percent())
mem.append(psutil.virtual_memory().percent)
disk.append(psutil.disk_usage('/').percent)
net_sent.append(psutil.net_io_counters().bytes_sent / 1024 / 1024)
net_recv.append(psutil.net_io_counters().bytes_recv / 1024 / 1024)
X = X[-60:]
cpu = cpu[-60:]
mem = mem[-60:]
disk = disk[-60:]
net_sent = net_sent[-60:]
net_recv = net_recv[-60:]
return (
go.Figure(data=[go.Scatter(x=X, y=cpu, mode='lines+markers', line=dict(color='cyan'))],
layout=go.Layout(title='CPU 使用率 (%)', paper_bgcolor='#111', plot_bgcolor='#222', font=dict(color='#fff'))),
go.Figure(data=[go.Scatter(x=X, y=mem, mode='lines+markers', line=dict(color='lime'))],
layout=go.Layout(title='内存 使用率 (%)', paper_bgcolor='#111', plot_bgcolor='#222', font=dict(color='#fff'))),
go.Figure(data=[go.Scatter(x=X, y=disk, mode='lines+markers', line=dict(color='orange'))],
layout=go.Layout(title='磁盘 使用率 (%)', paper_bgcolor='#111', plot_bgcolor='#222', font=dict(color='#fff'))),
go.Figure(data=[
go.Scatter(x=X, y=net_sent, mode='lines', name='发送 MB', line=dict(color='magenta')),
go.Scatter(x=X, y=net_recv, mode='lines', name='接收 MB', line=dict(color='aqua')),
], layout=go.Layout(title='网络传输 (MB)', paper_bgcolor='#111', plot_bgcolor='#222', font=dict(color='#fff')))
)
if __name__ == '__main__':
app.run(debug=False)
总结
-
希望对初学者有帮助
-
致力于办公自动化的小小程序员一枚
-
希望能得到大家的【一个免费关注】！感谢
-
求个 关注
-
此外还有办公自动化专栏，欢迎大家订阅：Python办公自动化专栏
-
求个 ❤️ 喜欢 ❤️
-
此外还有爬虫专栏，欢迎大家订阅：Python爬虫基础专栏
-
求个 收藏
-
此外还有Python基础专栏，欢迎大家订阅：Python基础学习专栏
