如何在cal-heatmap中向子域添加标签？

Question

我有一张卡热图显示最后一周的数据。每一行是一天，每列是一个小时。我在白天有标签，但没有时间。我该怎么加这些？

var cal = new CalHeatMap();
    cal.init({
        itemSelector: "#cal-heatmap",
        domain: "day",
        subDomain: "hour",
        rowLimit: 1,
        domainGutter: 0,
        data: data,
        start: new Date(_.keys(data)[0] * 1000),
        cellSize: 15,
        cellPadding: 5,
        cellRadius: 3,
        range: 7,
        verticalOrientation: true,
        displayLegend: false,
        label: {
            position: "left",
            offset: {
                x: 20,
                y: 12
            },
            width: 110
        },
        legend: [40, 80, 120, 160, 200, 240, 280, 320],
        legendColors: ["#f9eb49", "#d66938"]
    });

Answer 1

根据作者的说法，这还不可能，所以我想出了一个看起来不错的解决办法。我刚刚在我的主cal热图上做了另一个div，它显示了一个带有空标签的行，这样它就可以与下面的表格对齐。然后我用下面的代码填充它：

var labels = new CalHeatMap();
    labels.init({
        itemSelector: "#cal-heatmap-labels",
        domain: "day",
        subDomain: "hour",
        rowLimit: 1,
        domainGutter: 0,
        data: {},
        cellSize: 15,
        cellPadding: 5,
        cellRadius: 3,
        range: 1,
        verticalOrientation: true,
        displayLegend: false,
        tooltip: true,
        subDomainTextFormat: "%-I",
        subDomainDateFormat: "%-I%p",
        domainLabelFormat: "",
        label: {
            position: "left",
            offset: {
                x: 20,
                y: 12
            },
            width: 110
        }
    });

这是为我工作，看上去半体面。希望这能帮助一些人，至少在开发这个特性之前是这样。