Speedtest-Tracker 图表显示问题排查与解决方案

问题背景

在使用 Speedtest-Tracker 项目时，用户发现自定义上传和下载速度图表时遇到了显示异常。具体表现为：虽然已经修改了图表配置中的 beginAtZero 参数为 false，但下载图表能正常显示，而上传图表却始终从零开始显示，呈现平坦的曲线。

技术分析

图表配置原理

Speedtest-Tracker 使用 Filament 框架的图表组件来展示网络速度数据。图表配置主要通过两个核心文件控制：

1. RecentDownloadChartWidget.php - 控制下载速度图表
2. RecentUploadChartWidget.php - 控制上传速度图表

这两个文件中的 getOptions() 方法负责定义图表的显示行为，其中 beginAtZero 参数决定了 Y 轴是否强制从零开始。

常见配置修改

要使图表 Y 轴根据数据范围自动调整，而非强制从零开始，标准的修改方式是在 getOptions() 方法中添加：

'beginAtZero' => false,

这一配置理论上应该使两个图表都根据实际数据范围自动调整 Y 轴起始值。

问题排查过程

初步检查

1. 确认两个图表配置文件都已正确修改
2. 验证容器内的文件确实被自定义文件覆盖
3. 检查修改后的配置是否生效

深入排查

通过仔细检查，发现问题根源在于 Docker 挂载配置中的拼写错误。在挂载上传图表配置文件时，文件名缺少了扩展名最后的字母 "p"：

错误配置：

-v ${PWD}/custom/RecentUploadChartWidget.php:/app/www/app/Filament/Widgets/RecentUploadChartWidget.ph

正确配置：

-v ${PWD}/custom/RecentUploadChartWidget.php:/app/www/app/Filament/Widgets/RecentUploadChartWidget.php

解决方案

1. 修正 Docker 挂载命令中的文件名拼写错误
2. 确保容器内的文件路径与宿主机路径完全匹配
3. 重启容器使更改生效

经验总结

1. 文件挂载验证：在 Docker 中使用文件挂载时，务必仔细检查路径和文件名拼写
2. 配置一致性：当修改多个相似配置文件时，确保所有相关文件都得到正确更新
3. 容器内验证：可以通过进入容器内部检查文件内容，确认自定义修改是否成功应用
4. 日志检查：查看应用日志可以帮助识别配置加载问题

最佳实践建议

1. 使用环境变量或配置管理工具来统一管理这类图表显示参数
2. 考虑创建自定义 Widget 类来扩展默认功能，而非直接修改核心文件
3. 在修改前后进行配置备份，便于回滚和比较

通过这次问题排查，我们不仅解决了具体的图表显示问题，也加深了对 Docker 文件挂载和 Filament 图表配置的理解，为今后类似问题的快速定位提供了宝贵经验。