javascript - RickshawJSライブラリを使用してX軸にカスタムラベルを表示する

Question

が（ ）の形式の曜日である{x: someValue, y: count}ペアのデータセットがあります。ここで、は「日曜日」です。Ricskshawチャートでは、X軸にそれぞれ（月、火など）を表示したいと思います。それ、どうやったら出来るの？someValue1..71

現時点で私は次のことを行いました。

var ticksTreatment = 'glow';
var xAxisQPerDay = new Rickshaw.Graph.Axis.Time( {
          graph: graphQPerDay,
          ticksTreatment: ticksTreatment
      } );
xAxisQPerDay.render();

もちろん、これによりデフォルト値の1s、2s、3sなどが得られます。

Answer 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();