2016-03-18 2 views
0

У меня есть cal-heatmap, который отображает последнюю неделю данных. Каждая строка - это день, а каждый столбец - час. У меня есть ярлыки в дни, но не часы. Как я могу добавить их?Как добавить метки в субдомен в cal-heatmap?

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"] 
    }); 

ответ

0

По словам автора, это еще не возможно, поэтому я придумал обходное решение, которое выглядит прилично. Я просто сделал еще один div над моей основной cal-heatmap, который показывает одну строку с пустой меткой, чтобы она соответствовала таблице ниже. Затем я заполняю его следующим кодом:

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 
     } 
    }); 

Это работает для меня и выглядит наполовину приличным. Надеюсь, это поможет кому-то, по крайней мере, до тех пор, пока эта функция не будет развита.

Смежные вопросы