后端开发教程 - Java、Spring Boot 实战 - msg200.com
GitHub 年度回顾——10 种可视化你贡献的有趣方式
不管你喜欢还是讨厌，GitHub 贡献图通常都是帮助分享故事的好方法。
这一小串 ⬜️ 和 🟩 可以显示您何时开始新工作、何时做出第一个开源贡献、何时第一次让 GitHub Actions 运行（！），甚至何时休假去旅行或何时开始作为新父母的冒险。
例如，这是我在 2012 年创建的第一张手动创建的带注释的贡献图，重点介绍了我在那一年所做的一些事情：
2012年我周末工作太多，假期也不够，但确实挺有意思的。总之……
如果您在社交媒体上关注开发人员，那么您很有可能已经看到了各种各样的贡献图表、视频和各种精美的可视化效果，以突出他们对 2022 年的回顾。
就像 Spotify 的年度“ Wrapped ”和 Reddit 的🍌主题“ Recap ”一样，它们都提供了一种有趣的方式来突出您的工作。
以下 10 多种方法（无先后顺序）也适用于此。尽情享受吧！
1. GitHub解包
GitHub Unwrapped是一种有趣且充满节日气氛的方式来查看您 2002 年的公开活动。除了向您显示您在一周中的哪些时间和日期最有效率之外，它还会生成一棵圣诞树来显示您未解决和已解决的问题。
您可以像成千上万的其他人一样在社交媒体上分享它创建的 URL 或视频文件 - 请参阅#githubunwrappedTwitter 上的内容。
我的同事@abbycabs说上面的激增是由于产假造成的。希望如此！
2. GitHub 包装
GitHub Wrapped by Neat是一款简洁的小巧应用，可以显示你的提交总数、贡献数量以及已点赞和已收赞数。生成的图片会在你的个人资料 README中看起来很棒。
开发人员写了一篇很棒的小文章，介绍了他们如何做到这一点并在短短两周内达到 8000 名用户。
3. GitHub 趋势总结
代码行数改变✓ 条形图✓ 散点图✓ 按月、日、时间的贡献✓ 周末活动✓ GitHub Trends Wrapped 包含所有这些以及更多内容。
这是所有PHB在绩效评估时都会寻找的东西，如果你
诅咒我很幸运能拥有它们。
旁白：但愿不会。
4. GitHub 城市
你不应该用摇滚乐建造一座城市。你也不应该用你的 GitHub 贡献来建造一座城市。话虽如此，@honzaap还是成功地用three.js创建了一个很棒的可视化效果。
💡想法：应该添加一辆小汽车或飞机或可以用箭头键控制的东西。#hint-hint #hacktoberfest #good-first-issue
5. 开源包装
Open Source Wrapped就像 Spotify Wrapped，但它是为开源贡献而生的。你可以下载并分享它生成的图片，或者如果你像我一样虚荣，还可以把它们设置为手机背景😄
看看其他人在 Twitter 上分享了什么#githubunwrapped2022。
6. GitHub Skyline
GitHub Skyline以科幻、合成波的形式可视化您在某一年的贡献，您可以在浏览器、现实生活或虚拟现实中查看。
你甚至可以下载.stl文件，用 3D 打印机打印出来。它简直就是你书桌或壁炉架的完美装饰！这是@mishmanners之前创作的：
您知道吗：您的 GitHub Skyline 中有一个复活节彩蛋。
7. GitHub Wrap App
GitHub Wrap使用Next.js、Tailwind和Mona Sans 字体制作而成，可以生成肖像风格的图像，作为手机背景或您一直想放东西的空白相框看起来非常棒。
阅读有关@harshil1712 如何构建它的更多信息。
8. GitHub 镇
受到 GitHub Skyline 和 GitHub Cities 的启发，@mornhee创建了这个出色的 3D 场景，其中的方块代表月份，而摩天大楼代表贡献。
您知道吗：有一个浏览器扩展程序，可以提供用户个人资料上的贡献图的等距视图。
9. GitHub 贡献图表生成器
顾名思义，GitHub Contributions Chart Generator将提示您输入用户名，并生成该用户每年的贡献图表，直到其帐户创建为止。
这是回顾过去并讲述故事的好方法。
在 Twitter 上查看#githubcontributions以了解更多。
专业提示：如果您想尝试自己将这些数据可视化，您还可以使用该网页左下角的便捷链接下载 JSON 格式的数据。
10. 构建你自己的 GitHub 贡献可视化
说到 JSON，您可以使用GitHub GraphQL API通过如下查询来获取给定时间段内的贡献：
query ContributionGraph {
user(login: "filmgirl") {
contributionsCollection(
from: "2022-01-01T00:00:00+00:00"
to: "2022-12-31T00:00:00+00:00"
) {
contributionCalendar {
weeks {
contributionDays {
contributionCount
weekday
date
}
}
}
}
}
}
在方便的GitHub GraphQL Explorer上亲自尝试一下，您将看到类似以下内容的响应：
{
"data": {
"user": {
"contributionsCollection": {
"contributionCalendar": {
"weeks": [
{
"contributionDays": [
{
"contributionCount": 0,
"weekday": 6,
"date": "2022-01-01T00:00:00.000+00:00"
},
...
...
...
{
"contributionCount": 0,
"weekday": 6,
"date": "2022-12-31T00:00:00.000+00:00"
}
]
}
]
}
}
}
}
}
这是最简单的部分。现在到了有趣的部分！
务实地使用这些数据以及您最喜欢的数据可视化技术和库，您就可以变得非常有创造力！
您可以使用chartscii创建 ASCII 艺术图表来显示您上周的活动：
Mon (4.7%) ███░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
Tue (5.3%) ███░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
Wed (5.7%) ████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
Thu (11.8%) ████████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
Fri (68.3%) ████████████████████████████████████████████
Sat (3.3%) ██░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
Sun (0.8%) █░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
或者使用asciichart (适用于C、C#、C++、Elixir、Java、JavaScript、Go、Haskell、Perl、Python、PHP、Rust ，嗯... 你明白了)创建一个令人惊叹的 ASCII 折线图，展示您在过去几次冲刺中的活动过山车。
10 ┼---╮
09 ┤ ╰-╮
08 ┤ ╰-╮
07 ┤ ╰-╮
06 ┤ ╰╮
05 ┼ ╰╮ 🚀
04 ┤ ╰-╮ ╭-╯
03 ┤ ╰╮ ╭╯
02 ┤ ╰-╮ ╭-╯
01 ┤ ╰--╮ ╭--╯
00 ┤ ╰-----╯
或者也许使用Chart.js的多线图形来查看您与朋友、同事或死对头的排名？
有很多有趣且富有创意的方法来实现这些数据的可视化。
建造一些有趣的东西？对上面提到的某个东西感到自豪吗？在下面的评论中分享吧！
记住：生活远不止贡献图上的绿色方块、提交和代码行数。这些都是为了好玩而分享的，你可以根据需要分享到你的社交媒体动态或父母的冰箱里🤍💚
