Forge-Sanctum
LOG · 日志

plotlysite

DATE 日期
2026-10-23
SOURCE 源码
开发/plotlysite.md
READ 阅读
~3 min

plotlysite（文献计量可视化站）

给文献计量分析结果做公开呈现的研究者：读取清洗后的 CSV，按年份、国家、机构、关键词等维度生成统计卡片、趋势图与筛选视图，部署为纯静态站点供论文读者浏览。

状态：归档（2026-05 快照，数据与页面可用；与 文献计量分析展示page 同源）；入口：npm run dev（本地 :5173）或 GitHub Pages；仓库：本地归档，原仓已无远程

本质

把文献计量 CSV 转成可筛选、可引用的静态可视化页面的 Vue 前端。

选型

基于 Vue 3 + Vuetify 3 的纯静态单页应用，Plotly.js 负责图表，PapaParse 解析 CSV，Vite 构建，gh-pages 发布。

  • 运行时
    • Node 20.19+ / 22.12+
  • 前端
    • Vue 3
      • Vuetify 3
      • Vue Router
      • Pinia
      • vue-i18n
  • 可视化
    • Plotly.js
    • PapaParse（CSV 解析）
  • 部署
    • Vite + gh-pages

功能

  • 概览面板：文献总量、年份跨度、国家/机构/期刊等统计卡片。
  • 多维筛选：按年份、国家、机构、作者关键词过滤，图表联动更新。
  • 趋势与分布图：Plotly 折线、柱状与网络图，支持悬停读数。
  • CSV 数据源：public/csv/bibliometrics_data.csv 为唯一数据入口，替换即可复用。
  • 中英界面：vue-i18n 消息表切换。
  • 未完成：数据自动更新管线；移动端图表密度优化。

启动流程

npm install
npm run dev        # 本地开发 http://localhost:5173
npm run build      # 产出 dist/
npm run preview    # 预览构建产物
npm run deploy     # 发布到 gh-pages

前置：Node 20+；CSV 表头需与 src/utils/dataProcess.js 的字段契约一致；站点为纯静态，无后端与环境变量。

边界与已知问题

  • 数据边界：页面只读静态 CSV，不连接数据库，数据更新需重新构建。
  • 同源重复：与归档 文献计量分析展示page-代码-20260406 是同一展示站的两个快照，后续应合并为一份。
  • 研究边界：图表用于论文配图与读者浏览，不提供统计显著性检验。
  • 部署漂移：deploy 脚本走 gh-pages，当前归档副本未保留 GitHub 远程。

文档索引