制作github贪吃蛇贡献图

发布时间:
更新时间:

蛇图
如图所示,非常有趣:)

xingwangzhe/xingwangzhe: My personal repository

你可以查看我的主页仓库来看具体效果:)

创建workflow

在你的主页目录下建立

.github/workflows/snake.yml

2024-11-11-092848

接下来你需要复制我仓库中的snake.yml中的代码,方便起见,我直接贴在下面

name: Generate snake animation
on:
schedule:
- cron: "0 0 * * *" # run daily at mignight UTC
workflow_dispatch:
push:
branches:
- main
jobs:
generate:
permissions:
contents: write
runs-on: ubuntu-latest
timeout-minutes: 10
steps:
- name: generate snake.svg
uses: Platane/snk@v3
with:
# github user name to read the contribution graph from (**required**)
# using action context var `github.repository_owner` or specified user
github_user_name: ${{ github.repository_owner }}
# list of files to generate.
# one file per line. Each output can be customized with options as query string.
#
# supported options:
# - palette: A preset of color, one of [github, github-dark, github-light]
# - color_snake: Color of the snake
# - color_dots: Coma separated list of dots color.
# The first one is 0 contribution, then it goes from the low contribution to the highest.
# Exactly 5 colors are expected.
outputs: |
dist/github-snake.svg
dist/github-snake-dark.svg?palette=github-dark
dist/ocean.gif?color_snake=orange&color_dots=#bfd6f6,#8dbdff,#64a1f4,#4b91f1,#3c7dd9
- name: Deploy to GitHub Pages
uses: crazy-max/ghaction-github-pages@v4
with:
target_branch: output
build_dir: dist
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

然后点击上部导航栏的Actions查看snake.yml的状态,创建完毕后,会出现新的分支output。打开这个分支

2024-11-11-093349

你就会发现贪吃蛇的图了

引用使用

你需要把下面的路径中的xingwangzhe换成自己的github用户名

<!-- snake -->
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://github.com/xingwangzhe/xingwangzhe/blob/output/github-snake-dark.svg" />
<source media="(prefers-color-scheme: light)" srcset="https://github.com/xingwangzhe/xingwangzhe/blob/output/github-snake.svg" />
<img alt="github-snake" src="github-snake.svg" />
</picture>

于是乎,大功告成!

参考

【教程】我在GitHub个人主页玩贪吃蛇_哔哩哔哩_bilibili

留言评论

2000年1月1日星期六
00:00:00