如何使用Cal-Heatmap创建一个连续的类似Github的日历？

Question

我刚刚开始使用热图来创建一个类似Github的日历(例如，一年中的每一天都以块为单位的热图)。理想情况下，我希望它看起来像这样：

​

​

不幸的是，通过我的设置，我得到了更多的东西：

​

​

当前的问题是几个月之间的空白，例如，中间有白色块。我认为问题将是与domain、subdomain，可能还有range和rowLimit的一些设置组合，但我不能百分之百肯定这种组合应该是什么。我试过几次--这是我目前的设置：

    (function($) {
        $(document).ready(function() {

            var cal = new CalHeatMap();
            cal.init({
                start: new Date(2013, 0), // January 1, 2013
                maxDate: new Date(),
                range: 12,
                rowLimit: 7,
                domain: "month",
                subDomain: "day",
                data: "/api/users/1/annotations/",
                cellSize: 12
            });

        });
    })(jQuery);

我很确定这是可能的；我想问题是它是否有可能与月/年域，以及我需要使用什么设置来实现它。

2014年1月27日，编辑：，好吧，据@kamisama说，我已经尽可能接近了。以下是我当前的设置：

    cal.init({
        start: oneYearAgo(),
        maxDate: new Date(),
        range: 1,
        rowLimit: 7,
        domain: "year",
        subDomain: "day",
        data: "/api/users/1/annotations/",
        cellSize: 10.5
    });

这会让你像这样：

​

​

没有月份标签，也没有一周的标签。

Answer 1

如果您可以不使用creator而直接使用D3，那么就会有一个这里是一个自定义热图日历的好例子。，直接来自D3的创建者。

​

​

它更像是一种手动解决方案，但另一方面，它给您提供了使它看起来与您所希望的完全一致的自由。

Answer 2

有一个开放的API，可以根据日期以及数据计数、数据日期和颜色等数据获取所有的贡献。

您可以在以下位置访问相同的内容：https://0hrvuct456.execute-api.us-east-2.amazonaws.com/default/githubcalendar?username=shyamzzp

在此替换您的用户名以代替shyamzzp。