Github自动化生成统计图之metrics自动化

因为 GIthub 不具备查看每个人的私密仓库和提交量等数据的图表，那么如果我们个人开发者想给我们的 Github 个人首页添加一些特色图表显示我们对专业的态度，比如显示提交周期和语言等，因为 Github 只支持查看公开仓库的，那么我们想把私密的仓库提交量等都显示出来那么我们就需要用到 Github 的自动化（Actions）让他去获取我们 Github 里面的私密仓库数据，然后做成图片的形式展示在我们的个人首页即可。好在有lowlighter大神做的metrics让我们可以有多种图表选择，下面一起来看看吧

先展示一下效果图

这是我的 Github

这是lowlighter大神的

下面我们一起来看下如何做到的

仓库信息

这是仓库：lowlighter/metrics：一个信息图表生成器，📊 具有 30 +插件和 300 +选项，可显示有关您的 GitHub 帐户的统计信息并将其呈现为 SVG，Markdown，PDF 或 JSON！

官方文档：https://github.com/lowlighter/metrics#-documentation

首先我们要有一个公开的仓库

根据我们的 Github 用户名创建同名公开仓库（如果不存在），比如我的用户名是 Rakers1024 那就叫 Rakers1024

官网教程里面有好几种方案来构建我们的图表

我这里只讲一种就是第一种用 Github 的 actions 来构建

1.创建 GitHub 个人令牌

💡GitHub 个人令牌是必需的，因为此操作将提取无法通过存储库范围的令牌（如 ${{ secrets.GITHUB_TOKEN }} or `${{ github.token }}“），例如用户、组织、问题、拉取请求、评论、提交、活动等。

从您的帐户设置中，选择创建新令牌。Developer settings->Personal access tokens

作为一般规则，可能需要以下范围：

• public_repo对于某些插件

• read:org对于所有组织的相关指标

• repo对于所有私有仓库相关指标

• read:user对于某些私有仓库相关指标

• read:packages对于某些包相关指标

• read:project对于某些项目相关指标

• gist用于将渲染发布到要点而不是存储库

💡 出于安全原因，建议始终使用最少量的作用域。可以通过分叉此存储库并在工作流中使用它来防止安全问题（更多信息可在步骤 3 中找到）

创建一个永久的 token，选择必须的，一些插件有可能需要特定的权限，具体可以自己更新 token，这里我创建的权限是这些

2.将您的 GitHub 个人令牌放在存储库机密中

转到您的存储库并创建一个新密钥并将新生成的 GitHub 令牌粘贴到其中。Settings

3️ 设置 GitHub 操作工作流

从存储库的选项卡创建新工作流并粘贴以下内容：Actions

name: Metrics
on:
  # Schedule daily updates
  schedule: [{ cron: "0 0 * * *" }]
  # (optional) Run workflow manually
  workflow_dispatch:
  # (optional) Run workflow when pushing on master/main
  push: { branches: ["master", "main"] }
jobs:
  github-metrics:
    runs-on: ubuntu-latest
    permissions:
      contents: write
    steps:
      - uses: lowlighter/metrics@latest
        with:
          token: ${{ secrets.METRICS_TOKEN }}

保存后这个工作流会在每天 0 点执行生成一个图表 svg

因为我们现在是测试，总不能等到 0 点吧，手动先执行一次

这样我们就有了一张 svg 了

4️ 将图片添加到您的个人资料README.md

更新配置文件以包括渲染图像（如果设置了选项，文件名可能会有所不同，请相应地使用正确的路径）。README.md

示例：添加带有降价的渲染图像

![Metrics](/github-metrics.svg)

示例：使用 html 添加渲染图像以进行更多自定义

<img align="center" src="/github-metrics.svg" alt="Metrics" width="400" />

示例：使用config_display：列时添加渲染图像

<img src="/github-metrics.svg" alt="Metrics" width="100%" />

查看我们的 Github 主页就有效果了

当然上面是最基础的配置，要实现我这个效果还需要进行配置要显示什么图表

配置图表

配置可以在这里进行配置：Metrics (https://metrics.lecoq.io/embed?user=)

最后我们只需要把这块放到我们的工作流即可

最后放上我的配置

# Visit https://github.com/lowlighter/metrics#-documentation for full reference
name: Metrics
on:
  # Schedule updates (each hour)
  schedule: [{ cron: "0 3 * * *" }]
  # Lines below let you run workflow manually and on each commit
  workflow_dispatch:
  push: { branches: ["master", "main"] }
jobs:
  github-metrics:
    runs-on: ubuntu-latest
    permissions:
      contents: write
    steps:
      - uses: lowlighter/metrics@latest
        with:
          # Your GitHub token
          # The following scopes are required:
          #  - public_access (default scope)
          # The following additional scopes may be required:
          #  - read:org      (for organization related metrics)
          #  - read:user     (for user related data)
          #  - read:packages (for some packages related data)
          #  - repo          (optional, if you want to include private repositories)
          token: ${{ secrets.METRICS_TOKEN }}

          # Options
          user: Rakers1024
          template: classic
          base: header, activity, community, repositories, metadata
          config_display: large
          config_timezone: Asia/Shanghai
          plugin_calendar: yes
          plugin_calendar_limit: 1
          plugin_isocalendar: yes
          plugin_isocalendar_duration: full-year
          plugin_languages: yes
          plugin_languages_analysis_timeout: 15
          plugin_languages_categories: markup, programming
          plugin_languages_colors: github
          plugin_languages_limit: 8
          plugin_languages_recent_categories: markup, programming
          plugin_languages_recent_days: 14
          plugin_languages_recent_load: 300
          plugin_languages_sections: most-used
          plugin_languages_threshold: 0%
          plugin_topics: yes
          plugin_topics_limit: 15
          plugin_topics_mode: starred
          plugin_topics_sort: stars