Chart.js 环形图是 wpDataTables 提供的可视化图表类型之一,它以圆环的形式直观呈现各部分在整体中所占的比例。在本页中,环形图用于展示各地区销量占比,让访客一眼看清不同地区对总体销量的贡献份额,无需逐行对比表格数据。
下方嵌入的是一个实时图表,数据与后台数据源保持同步。环形的中部可以留白,既能放置说明文字或汇总数值,也让整体观感更加现代、简洁。将鼠标悬停在任意环段上,即可查看对应地区的具体数值与占比。
- 数据准备:环形图适合呈现占比关系,建议每个地区对应一行数据,类别不宜过多,以保证各环段清晰可辨。
- 中部留白:可调整环形的内径大小,中部留出空间用于放置总销量或标题,让图表观感更现代。
- 交互与配色:为各地区设置区分度高的颜色,并开启悬停提示,方便访客读取每个地区的销量与占比。
- 响应式展示:启用自适应宽度,使图表在桌面与移动端都能完整、清晰地显示。
- 本页使用的短代码: