一、介绍

最近博客圈里年度报告的风愈刮愈烈，我原本想借着这股热度，用 AI 快速制作一个展示年度数据的静态页面。但实际用起来才发现问题：页面数据完全固定，哪怕只是小幅更新，都得手动调整数值，实在费时又麻烦。

后来留意到 Joe 主题的统计页面本就会展示一些基础数据，便萌生了在这个页面上新增年度 / 月度统计模块的想法 —— 这样数据能动态同步，就不用再手动维护了。

不过在落地过程中，几经调整才找到合适的呈现方式：

初版采用用 ECharts 把浏览量、文章数、评论数三类核心数据做成三个独立图表，结果页面被拉得过长，视觉观感大打折扣；

第二版尝试将三类数据整合到同一个图表中，可浏览量的数值量级远高于文章数和评论数，后两者的变化趋势几乎完全被掩盖，根本看不清晰；

第三版又调整思路，把浏览量单独拆分展示，将文章数和评论数合并在一个图表里，但整体呈现效果依旧不尽如人意；

最终敲定了 “双 Y 轴 + 混合图表” 的方案，既解决了不同数据量级的展示问题，又让页面布局更紧凑美观，数据对比也更直观。

二、实现过程

最终效果如下：站点归档