在网站上嵌入Github贡献图 [英] Embed Github contributions graph in website
本文介绍了在网站上嵌入Github贡献图的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
是否可以在HTML5中嵌入Github贡献图?
Is there a way to embed the Github contributions graph in HTML5?
推荐答案
我写了一个JavaScript库来做到这一点: github-calendar .
I wrote a JavaScript library to do that: github-calendar.
此处是如何使用它的示例:
Here is an example how to use it:
<!-- Prepare a container for your calendar. -->
<script
src="https://cdn.rawgit.com/IonicaBizau/github-calendar/gh-pages/dist/github-calendar.min.js"
>
</script>
<!-- Optionally, include the theme (if you don't want to struggle to write the CSS) -->
<link
rel="stylesheet"
href="https://cdn.rawgit.com/IonicaBizau/github-calendar/gh-pages/dist/github-calendar.css"
/>
<!-- Prepare a container for your calendar. -->
<div class="calendar">
<!-- Loading stuff -->
Loading the data just for you.
</div>
<script>
new GitHubCalendar(".calendar", "your-username");
</script>
此处,您可以在运行中看到它:
Here you can see it in action:
基本上,由于我们需要跨域请求,因此需要代理.它向GitHub个人资料页面(github.com/<user>
)发出请求,然后从那里带回所需的内容.
Basically, since we need cross domain requests we need a proxy. It makes a request to GitHub profile page (github.com/<user>
) and then brings back the needed stuff from there.
有关更多信息,请查看GitHub上的文档.
For more information, check out the documentation on GitHub.
这篇关于在网站上嵌入Github贡献图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文