Отображение пользовательских меток на оси X с помощью библиотеки Rickshaw JS
У меня есть набор данных с парами {x: someValue, y: count}
где someValue
это день недели в виде (1..7
) где 1
это "воскресенье". На графике Рикшоу я хотел бы отобразить (Mon, Tue..etc) соответственно на оси X. Как я могу это сделать?
На данный момент я сделал:
var ticksTreatment = 'glow';
var xAxisQPerDay = new Rickshaw.Graph.Axis.Time( {
graph: graphQPerDay,
ticksTreatment: ticksTreatment
} );
xAxisQPerDay.render();
но это дает мне, конечно, значения по умолчанию 1 с, 2 с, 3 с и т. д...
1 ответ
Решение
Примерно так должно работать:
var xAxisQPerDay = new Rickshaw.Graph.Axis.X({
graph: graphQPerDay,
tickFormat: function(x) {
switch (x) {
case 1: return 'Mon';
case 2: return 'Tue';
case 3: return 'Wed';
case 4: return 'Thu';
case 5: return 'Fri';
case 6: return 'Sat';
case 7: return 'Sun';
}
}
});
xAxisQPerDay.render();
Более динамичный подход, если вы построили карту сбоку для кэширования данных поля.
var days = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
var xAxisQPerDay = new Rickshaw.Graph.Axis.X({
graph: graphQPerDay,
tickFormat: function(x) {
return days[x];
}
});
xAxisQPerDay.render();
ИЛИ ЖЕ
var days = { 0: 'Mon', 1: 'Tue', 2: 'Wed', 3: 'Thu', 4: 'Fri', 5: 'Sat', 6: 'Sun' };
var xAxisQPerDay = new Rickshaw.Graph.Axis.X({
graph: graphQPerDay,
tickFormat: function(x) {
return days[x];
}
});
xAxisQPerDay.render();