AMAZEHOME/monitor
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改图表逻辑

Browse Source
This commit is contained in:
Alex Yang
2025-12-03 12:24:53 +08:00
parent 454a205051
commit 8bd13e3af1
1 changed files with 100 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
backend/static/js/app.js
View File

@@ -1615,20 +1615,86 @@ function updateCharts(cpuData, memoryData, diskData, networkData) {
// 保存当前选中的网卡
state.currentInterface = state.currentInterface || 'all';
// 更新网络流量趋势图表（发送总和和接收总和）
if (networkData && charts.network) {
let selectedNetworkData = networkData;
// 如果是按网卡分组的数据，选择当前选中的网卡数据
if (typeof networkData === 'object' && networkData.sent === undefined && networkData.received === undefined) {
selectedNetworkData = networkData[state.currentInterface] || networkData['all'] || {};
// 数据求和辅助函数：计算所有网卡在同一时间点的数据之和
const sumAllInterfacesData = (networkData, metricType) => {
if (typeof networkData !== 'object' || networkData === null) {
return [];
}
if (selectedNetworkData.sent && selectedNetworkData.received) {
// 收集所有时间点
const allTimes = new Set();
const interfaceDatas = [];
// 遍历所有网卡
for (const iface in networkData) {
if (networkData.hasOwnProperty(iface) && typeof networkData[iface] === 'object') {
const ifaceData = networkData[iface][metricType];
if (Array.isArray(ifaceData)) {
interfaceDatas.push(ifaceData);
// 收集所有时间点
ifaceData.forEach(item => {
allTimes.add(item.time);
});
}
}
}
// 如果没有数据，返回空数组
if (interfaceDatas.length === 0) {
return [];
}
// 将时间点转换为数组并排序
const sortedTimes = Array.from(allTimes).sort((a, b) => new Date(a) - new Date(b));
// 计算每个时间点的总和
const summedData = sortedTimes.map(time => {
let sum = 0;
// 遍历所有网卡数据，累加同一时间点的值
interfaceDatas.forEach(ifaceData => {
// 查找当前时间点的数据
const dataPoint = ifaceData.find(item => item.time === time);
if (dataPoint) {
sum += dataPoint.value;
}
});
return {
time: time,
value: sum
};
});
return summedData;
};
// 更新网络流量趋势图表（发送总和和接收总和）
if (networkData && charts.network) {
let sentData, receivedData;
// 如果是按网卡分组的数据
if (typeof networkData === 'object' && networkData.sent === undefined && networkData.received === undefined) {
if (state.currentInterface === 'all') {
// 计算所有网卡的发送总和
sentData = sumAllInterfacesData(networkData, 'sent');
// 计算所有网卡的接收总和
receivedData = sumAllInterfacesData(networkData, 'received');
} else {
// 选择当前选中的网卡数据
const selectedNetworkData = networkData[state.currentInterface] || networkData['all'] || {};
sentData = selectedNetworkData.sent || [];
receivedData = selectedNetworkData.received || [];
}
} else {
// 直接使用数据
sentData = networkData.sent || [];
receivedData = networkData.received || [];
}
if (sentData.length > 0 || receivedData.length > 0) {
// 计算发送总和（时间段内的累积值）
if (Array.isArray(selectedNetworkData.sent) && selectedNetworkData.sent.length > 0) {
if (Array.isArray(sentData) && sentData.length > 0) {
// 排序发送数据
const sortedSent = sortDataByTime(selectedNetworkData.sent);
const sortedSent = sortDataByTime(sentData);
// 计算累积发送总和（MB）
let cumulativeSent = 0;
@@ -1651,9 +1717,9 @@ function updateCharts(cpuData, memoryData, diskData, networkData) {
}
// 计算接收总和（时间段内的累积值）
if (Array.isArray(selectedNetworkData.received) && selectedNetworkData.received.length > 0) {
if (Array.isArray(receivedData) && receivedData.length > 0) {
// 排序接收数据
const sortedReceived = sortDataByTime(selectedNetworkData.received);
const sortedReceived = sortDataByTime(receivedData);
// 计算累积接收总和（MB）
let cumulativeReceived = 0;
@@ -1681,17 +1747,31 @@ function updateCharts(cpuData, memoryData, diskData, networkData) {
// 更新网速趋势图表
if (networkData && charts.speed) {
let selectedNetworkData = networkData;
let sentData, receivedData;
// 如果是按网卡分组的数据，选择当前选中的网卡数据
// 如果是按网卡分组的数据
if (typeof networkData === 'object' && networkData.sent === undefined && networkData.received === undefined) {
selectedNetworkData = networkData[state.currentInterface] || networkData['all'] || {};
if (state.currentInterface === 'all') {
// 计算所有网卡的发送速率总和
sentData = sumAllInterfacesData(networkData, 'sent');
// 计算所有网卡的接收速率总和
receivedData = sumAllInterfacesData(networkData, 'received');
} else {
// 选择当前选中的网卡数据
const selectedNetworkData = networkData[state.currentInterface] || networkData['all'] || {};
sentData = selectedNetworkData.sent || [];
receivedData = selectedNetworkData.received || [];
}
} else {
// 直接使用数据
sentData = networkData.sent || [];
receivedData = networkData.received || [];
}
if (selectedNetworkData.sent && selectedNetworkData.received) {
if (sentData.length > 0 || receivedData.length > 0) {
// 更新发送流量
if (Array.isArray(selectedNetworkData.sent) && selectedNetworkData.sent.length > 0) {
const sortedData = sortDataByTime(selectedNetworkData.sent);
if (Array.isArray(sentData) && sentData.length > 0) {
const sortedData = sortDataByTime(sentData);
// 使用固定份数X轴数据计算
const fixedPointsData = getFixedPointsData(sortedData);
charts.speed.data.datasets[0].data = fixedPointsData.map(item => ({
@@ -1701,8 +1781,8 @@ function updateCharts(cpuData, memoryData, diskData, networkData) {
}
// 更新接收流量
if (Array.isArray(selectedNetworkData.received) && selectedNetworkData.received.length > 0) {
const sortedData = sortDataByTime(selectedNetworkData.received);
if (Array.isArray(receivedData) && receivedData.length > 0) {
const sortedData = sortDataByTime(receivedData);
// 使用固定份数X轴数据计算
const fixedPointsData = getFixedPointsData(sortedData);
charts.speed.data.datasets[1].data = fixedPointsData.map(item => ({