数据来源
总览页的曲线来自 content/metrics.mjs 的 throughput 对象:
export const throughput = {
title: '吞吐曲线 · 近 24 小时',
unit: 'pts/s',
series: [
{ name: '采集', color: 'var(--accent)', data: [/* 24 个点 */] },
{ name: '下发', color: '#f59e0b', data: [/* 24 个点 */] },
],
};
改时间窗
data 数组的长度即时间窗内的采样点数。当前是 24 个点 = 每小时一个点。
想要 5 分钟粒度,把数组换成 288 个点,并同步改 LineChart.astro 里的 x 轴刻度。
加一条序列
在 series 里追加一项即可,颜色建议从 --accent、--warn、--info 里选,
保持全站色彩语义一致。图例会自动出现。
接真实后端
把 content/metrics.mjs 换成一次 fetch(),或者让构建脚本在打包前写入该文件。
页面模板无需改动 —— 这是刻意设计的分层。